引導選項卡（「秀」）不起作用的dynimcally加載「選項卡內容」

我使用ASP.NET MVC和自舉3引導選項卡（「秀」）不起作用的dynimcally加載「選項卡內容」

我使用的引導標籤，這樣

<div class="row"> 
     <div class="tabs-container"> 
      <ul class="nav nav-tabs" id="test"> 
       <li class="active"><a data-toggle="tab" href="#tab-operations">Operations</a></li> 
       <li class=""><a data-toggle="tab" href="#tab-categories">Categories</a></li> 
      </ul> 
      @Html.Partial("_Ordering", Model) 
     </div> 
    </div>

我的主視圖

這樣

<div class="tab-content" id="ordDiv"> 
    <div id="tab-operations" class="tab-pane active"> 
     // some content not important 
    </div> 
    <div id="tab-categories" class="tab-pane"> 
     // some content not important 
    </div> 
</div>

，我用不顯眼的Ajax更新局部視圖局部視圖_Ordering

@Ajax.ActionLink("cancel", "PartialOrdering", null, 
    new AjaxOptions { HttpMethod = "GET", Url = Url.Action("PartialOrdering"), UpdateTargetId = "ordDiv", InsertionMode = InsertionMode.Replace }, null)

標籤的內容正確更新沒有任何問題。

問題是我想顯示在ajax請求刷新內容之前已經存在的選項卡。我用js代碼此類似這樣的

var a = $('#test li.active').find('a'); 
a.click();  // not showing the content of the tab 
a.tab('show'); // also this not showing the content of the tab

前面的代碼不作任何錯誤控制檯，但如果你想在這裏展示一個特定的標籤，你會想要的選項卡不顯示

來源

2016-12-23 Hakam Fostok

您有加入到bootstrap.js文件在您DOM參考？ – Aamir

@Aamir你在開玩笑嗎，如果我沒有添加bootstrap.js，'tab'函數會在控制檯中給出一個錯誤，這不是我的情況，正如我所說在控制檯中沒有任何錯誤。 –

需要傳遞特定錨標記的id，並根據該錨可以調用tab()函數。

$(document).ready(function(){ 
    activeaTab('tab-categories'); 
}); 
function activeaTab(tab){ 
    $('.nav-tabs a[href="#' + tab + '"]').tab('show'); 
};

https://jsfiddle.net/ewaeLkvv/

來源

2016-12-23 13:06:47 Aamir

**第一**這是從SO上的另一個答案複製和粘貼，然後我問這個問題，我做了一個非常廣泛的搜索，我之前創建了這個答案，它並沒有幫助我。 ** second **我正在做同樣的事情，只是我以不同的方式獲取錨點元素，實際上'$（'。nav-tabs a [href =「＃'+ tab +'」]'）'是同樣用於$（'＃test li.active'）。find（'a'）'我已經有了。我的問題是'tab'函數本身不起作用。 **第三**你是硬編碼的選項卡顯示，但我想在顯示選項卡之前做ajax請求。 –

感謝您試圖幫助我，但這沒有奏效 –

引導選項卡（「秀」）不起作用的dynimcally加載「選項卡內容」

回答

相關問題