jqueryを使用してナビゲートブートストラップタブ

Question

私はブートストラップタブを使用しています。それはうまくいく。

ページが開くと、「AddExchange」である「tabActive」の値を渡したいことがあります。デフォルトの「#All」タブの代わりに#AddExchangeタブをナビゲート/表示するにはどうすればよいですか？概念的には、以下のwindow.location.replaceを使用しようとしていますが、動作していません。

if (tabActive) { 
    switch (tabActive) { 
     case "Beginner": 
      $("#li_All").removeClass("active"); 
      $("#li_Beginner").addClass("active"); 
      $("#li_AddExchange").removeClass("active"); 
      break; 
     case "AddExchange": 
      $("#li_All").removeClass("active"); 
      $("#li_Beginner").removeClass("active"); 
      $("#li_AddExchange").addClass("active"); 
      //location.href = "#AddExchange"; 
      window.location.replace("#AddExchange"); 
      break; 
} 

Answer 1

これにはブートストラップ方式.tab('show')を使用できます。

ただし、変数tabActiveの値はあなた次第です。そこから、あなたは自分のif文を実行し、そうのように、ライブラリーを提供する方法で使用することができます：デフォルトactiveタブを上書きして、動的なものを選択する必要があり

//We will assume tabActive = 'AddExchange' here 
if (tabActive !== undefined){ 
    //This should open the #li_AddExchange tab on page load. 
    //IF that is actually the ID of your tabs' navigation 
    $('#li_'+tabActive +' a').tab('show'); 
} 

を。 このメソッドを使用した簡単なフィドルの例を次に示します。表示されたタブはデフォルトのアクティブなタブではないことに注意してください。あなたがあなたの条件に基づいて選択したいタブを設定するコントローラでhttps://jsfiddle.net/ommhdm4o/2/

Answer 2

：

//some conditions 
    ViewBag.SelectedTab = "li_AddExchange"; 

カミソリビュー、あなたはViewBag値

<input id="hiddenSelectedTab" type="hidden" value="@ViewBag.SelectedTab"/> 

はあなたが値を取得するjavascriptを使用してつかむこと非表示の入力に設定し、それをタブメソッドのセレクタとして使用するだけです。

<script> 
    $().ready(function(){ 
     var selectedTab = $('#hiddenSelectedTab').val(); 
     $('#' + selectedTab + ' a:first').tab('show'); 
     }); 
</script> 

タブを使用するには、jqueryの後にインポートされたブートストラップのjavascriptファイルが必要です。