0

我正在处理一个基于angularjs的page.and我正在使用tabset功能的引导为一个页面。我可以使用标签()jquery功能的水平标签,但我使用垂直tabset为我的page.its一个展望风格的页面。如何更改在angularjs按钮点击活动标签?

<div class="white-bg animated fadeIn"> 

<div class="row s-t-xs"> 
    <div class="col-xs-10"> 
     <div class="tabs-container"> 

       <tabset class="tabs-left"> 
        <tab id="tab1" heading="Job Preferences"> 
        //TAB1 Content 
        <div class="form-group"> 
        <div class="col-md-10 col-sm-offset-9"> 
      <button class="btn btn-primary" type="submit" id="button1">Save &amp; Next</button> 
        </div> 
        </div> 
        </tab> 

        <tab id="tab2" heading="Experience/Project Summary" > 
        //TAB2 Content 
        <div class="form-group"> 
        <div class="col-md-10 col-sm-offset-9"> 
      <button class="btn btn-primary" type="submit" id="button2">Save &amp; Next</button> 
        </div> 
        </div> 
        </tab> 


        <tab id="tab3" heading="Educations/Certifications/Awards"> 

        //TAB3 Content 
        <div class="form-group"> 
        <div class="col-md-10 col-sm-offset-9"> 
      <button class="btn btn-primary" type="submit" id="button3">Finish</button> 
        </div> 
        </div> 

        </tab> 
       </tabset> 

     </div> 
    </div> 
</div> 

我需要的是改变激活第二个选项卡当我点击“保存&下一步”在第一次tab..and的第三个标签按钮被激活,当我点击了“保存时&下一个”按钮?第二个选项卡中有没有什么简单的办法可以让它做

+0

检查这个小提琴http://jsfiddle.net/simonbingham/bFWUM/ –

回答

0

HTML:

<tabset> 
<tab heading="First" ng-attr-active="firtTab">Content1</tab> 
<tab heading="Second" ng-attr-active="secondTab">Content2</tab> 
</tabset> 

控制器:

$scope.firstTab = true; 
$scope.secondTab = false; 
$scope.next= function(){ 
$scope.firstTab = false; 
$scope.secondTab = true; 
}