I'm using asp.net together with jquery. In Default.aspx I have implemented some jquery-tabs that load their data with ajax call. They load another asp.net page MyTab.aspx. My problem is that when I navigate in the tab (MyTab.aspx) it always reloads the full page (whole Default.aspx) but I only want it to reload inside the tab. For example when adding an item I just want the tab to reload.
So I added a updatepanel inside MyTab.aspx. The problem is now instead that all links on Default.aspx is broken, it just open the selected tab in the whole window when clicking. Very strange, but I've read that sometimes it can be messy to get updatepanels to work with jquery.
You can see my code below, is there anything I can do different to get it working?
In Default.aspx:
<html>
<head runat="server">
<script type="text/javascript">
$(function() {
$('.tabs').tabs();
});
</script>
</head>
<body>
<form id="form1" runat="server">
<asp:ScriptManager ID="ScriptManager1" runat="server" EnablePartialRendering="true" />
<div class="tabs">
<ul>
<li><a href="#PanelTab">Tab0</a></li>
<li><a href='MyTab.aspx?type=1'>Tab1</a></li>
<li><a href='MyTab.aspx?type=2'>Tab2</a></li>
</ul>
<div id="PanelTab">Content0</div>
</div>
</form>
<body>
<html>
In MyTab.aspx:
<html>
<body>
<form id="formTab" runat="server">
<asp:ScriptManager ID="ScriptManagerTab" runat="server" EnablePartialRendering="true" />
<asp:UpdatePanel runat="server" ChildrenAsTriggers="true" ID="UpdatePanelList" UpdateMode="Always">
<ContentTemplate>
<asp:SqlDataSource ID="DSTab"
runat="server"
DataSourceMode="DataSet"
ConnectionString="XXX"
ProviderName="MySql.Data.MySqlClient"
SelectCommand="XXX"
>
<SelectParameters>
<asp:QueryStringParameter QueryStringField="type" Name="?type" />
</SelectParameters>
</asp:SqlDataSource>
<asp:GridView ID="GridViewTab" DataKeyNames="id" DataSourceID="DSTab" AutoGenerateColumns="false" runat="server" >
<Columns>
<asp:TemplateField>
<ItemTemplate>
<asp:HyperLink ID="HyperLinkTab" NavigateUrl='Item.aspx' runat="server"><%# Eval("title")%></asp:HyperLink>
<asp:Button OnClick="AddItem" ID="ButtonAddItem" Text="Add" runat="server" />
</ItemTemplate>
</asp:TemplateField>
</Columns>
</asp:GridView>
<asp:Button OnClick="CreateNewItem" ID="ButtonCreateNewItem" Text="Create New" runat="server" />
</ContentTemplate>
</asp:UpdatePanel>
</form>
</body>
</html>