CODEWITHSUNDEEP
jqueryasp.nettwitter-bootstrapwebformstabs
breakerdotnet
breakerdotnet

Reputation: 93

Twitter Bootstrap tabs, a href with runat server

I am using the twitter bootstrap's tabs successfully. However as soon as I change the inner href of the list item to runat="server", it loses the tab functionality. 

<ul id="tab" class="nav nav-tabs">
    <li id="liItemInfo" runat="server"><a href="#<%=tbItemInfo.ClientID %>" data-toggle="tab">Item Information</a></li>
    <li id="liDocuments" runat="server"><a id="lnkDocuments" runat="server" href="#<%=tbDocuments.ClientID %>" data-toggle="tab">Documents (0)</a></li>
    <li id="liHistory" runat="server"><a href="#tbHistory" data-toggle="tab">History</a></li>
</ul>

So in the example above, the 1st and 3rd tabs are working but not the second, ie. if you click on it nothing happens. The reason I need it available at the server is to set the amount of documents uploaded. Is there anything that I can do to get this to work?

Upvotes: 0

Views: 986

Answers (1)

breakerdotnet
breakerdotnet

Reputation: 93

As Sjoerd eluded to it seems to be a similar issue as the href click problem if i add runat="server" attribute in asp.net

To get it to work I replaced the a href with a asp:hyperlink as below:

<ul id="tab" class="nav nav-tabs">    
    <li id="liItemInfo" runat="server"><asp:HyperLink ID="lnkItemInfo" runat="server" NavigateUrl="#tbItemInfo" data-toggle="tab">Item Information</asp:HyperLink></li>
    <li id="liDocuments" runat="server"><asp:HyperLink ID="lnkDocuments" runat="server" NavigateUrl="#tbDocuments" data-toggle="tab">Documents (0)</asp:HyperLink></li>    
    <li id="liHistory" runat="server"><asp:HyperLink ID="lnkHistory" runat="server" NavigateUrl="#tbHistory" data-toggle="tab">History</asp:HyperLink></li>
</ul>

Upvotes: 0

Related Questions