Found some workaround. I defined another linkbutton outside the <div id="divTabs">
, and the linkbutton inside <div id="divTabs">
will call the outer linkbutton. So the code becomes like
<asp:LinkButton ID="LinkButton1" runat="server" OnClick="TabLink1_Click" ></asp:LinkButton>
<asp:LinkButton ID="LinkButton2" runat="server" OnClick="TabLink2_Click" ></asp:LinkButton>
<asp:LinkButton ID="LinkButton3" runat="server" OnClick="TabLink3_Click" ></asp:LinkButton>
<div id="divTabs">
<ul>
<li runat="server" id="TabBar1" ><asp:LinkButton ID="TabLink1" runat="server"> Link1 </asp:LinkButton></li>
<li runat="server" id="TabBar2" ><asp:LinkButton ID="TabLink2" runat="server"> Link2 </asp:LinkButton></li>
<li runat="server" id="TabBar3" ><asp:LinkButton ID="TabLink3" runat="server"> Link3 </asp:LinkButton></li>
</ul>
....
</div>
In the code behind, inside the Page_Load
function
TabLink1.OnClientClick = "document.getElementById('" + LinkButton1.ClientID + "').click();";
TabLink2.OnClientClick = "document.getElementById('" + LinkButton2.ClientID + "').click();";
TabLink3.OnClientClick = "document.getElementById('" + LinkButton3.ClientID + "').click();";
I'm guessing the jQuery library might have some impact such that the link does not call a postback, so I'm using the workaround above.