부트 스트랩 모달 폼 (다음/이전 버튼 포함)

Question

부트 스트랩에 익숙하지 않고 jQueryUI에서 온 것입니다. 다음/이전 폼 인터페이스에서 스크롤 뷰포트 아이디어를 얻으려고했는지 궁금합니다. 내가 함께 일해 왔던 과거

다음 : 나는 또한 ask- 등 ​​검증

Answer 1

와 우려 피려하고 싶어하고 싶어 시작 그래서 전에

http://css-tricks.com/jquery-ui-tabs-with-nextprevious/

을 테스트되지 않았지만 기본적인 개념은 tabbable nav를 모달 바디에 포함시키고 다음과 같은 모든 탭 내용에 이전/다음 버튼을 추가하는 것입니다.

<form action=""> 
    <div class="tabbable"> 
     <ul class="nav nav-tabs"> 
      <li class="active"><a href="#tab1" data-toggle="tab">Section 1</a></li> 
      <li class=""><a href="#tab2" data-toggle="tab">Section 2</a></li> 
     </ul> 
     <div class="tab-content"> 
      <div class="tab-pane" id="tab1"> 
      <p>Form for section one</p> 
      <a href="#tab2" data-toggle="tab" class="btn pull-right">Next</a> 
      </div> 
      <div class="tab-pane" id="tab2"> 
      <p>Next form part</p> 
      <a href="#tab2" data-toggle="tab" class="btn pull-left">Prev</a> 
      </div> 
     </div> 
     </div> 
</form> 

다른 옵션은 <ul> -Tag를 숨기고 이전/다음 버튼을 모달 바닥 글에 넣는 것입니다.

Answer 2

<div class="tab-pane" id="tab1"> 

해야

<div class="tab-pane active" id="tab1"> 

Answer 3

I가 아마 같은 기술을 사용할 수 있습니다 http://fearlessflyer.com/next-and-previous-buttons-bootstrap-photo-gallery/

부트 스트랩 를 사용하여 사진 갤러리에 이전/다음 버튼을 추가하는 튜토리얼 - ($를 사용하여 this) .index().