Bootstrap 3選項卡不使用URL應用a href.Razor中的操作

Question

我的剃須刀中有一些標簽：

<div class="page-tabs">
<ul class="nav nav-tabs">
    <li class='@(actionName.ToLower() == "viewsongamendments" &&
                 controllerName.ToLower() == "songmanagement" ? "active" : "")'>
        <a href='@Url.Action("ViewSongAmendments", "SongManagement")' data-container="body" data-toggle="tooltip" title="Old Track Details">Old Track Details</a>
    </li>
    <li class='@(actionName.ToLower() == "updatedamendments" &&
                 controllerName.ToLower() == "songmanagement" ? "active" : "")'>
        <a href='@Url.Action("UpdatedSongAmendments", "SongManagement")' data-container="body" data-toggle="tooltip" title="Updated Track Details">Updated Track Details</a>
    </li>
</ul>

但是在查看源代碼時，它沒有將ahref應用於選項卡。 目前，這表明：

<a data-container="body" data-toggle="tooltip" title="" data-original-title="Old Track Details">Old Track Details</a>

Answer 1

引導程序選項卡的工作方式如下，請注意，href是如何從nav元素與tab-content元素中的tab-content匹配的。 在此引導上下文中使用href它不是指向操作的鏈接。

<ul class="nav nav-tabs">
    <li class="active"><a data-toggle="tab" href="#home">Home</a></li>
    <li><a data-toggle="tab" href="#menu1">Menu 1</a></li>
    <li><a data-toggle="tab" href="#menu2">Menu 2</a></li>
</ul>

<div class="tab-content">
    <div id="home" class="tab-pane fade in active">
        <h3>HOME</h3>
        <p>Some content.</p>
    </div>
    <div id="menu1" class="tab-pane fade">
        @Html.RenderAction("ViewSongAmendments", "SongManagement")
    </div>
    <div id="menu2" class="tab-pane fade">
        <h3>Menu 2</h3>
        <p>Some content in menu 2.</p>
    </div>
</div>

Answer 2

我設法使其與下面的代碼一起使用。 我最終添加了一個變量new { songid = fullAccountCode ，fullAccountCode從模型中提取了一個值。

<div class="page-tabs">
<ul class="nav nav-tabs">
    <li class='@(actionName.ToLower() == "viewsongamendments" &&
             controllerName.ToLower() == "songsmanagement" ? "active" : "")'>
        <a href='@Url.Action("ViewSongAmendments", "SongsManagement", new { songid = fullAccountCode})' data-container="body" data-toggle="tooltip" title="Original">Old Song Details</a>
    </li>
    <li class='@(actionName.ToLower() == "updatedsongamendments" &&
             controllerName.ToLower() == "songsmanagement" ? "active" : "")'>
        <a href='@Url.Action("UpdatedSongAmendments", "SongsManagement", new { songid = fullAccountCode})' data-container="body" data-toggle="tooltip" title="Original">Updated Song Details</a>
    </li>
</ul>