Search code examples
asp.netjquerypostback

Staying on current jQuery tab across post back?


I am using jQuery tabs and an ASP.NET listview to display and edit some information. My problem is that when a user inserts a new record in one of the listview items my jQuery tabs go back to the first tab. Is there a way to keep track of which tab I am on or keep it from resting on post back?


Solution

  • In ASP.NET, you can store it in a hidden field without having to use a cookie (no need for the jQuery cookie reference).

    Use this:

    $(function () {
        $("#tabs").tabs({ 
            activate: function() {
                var selectedTab = $('#tabs').tabs('option', 'active');
                $("#<%= hdnSelectedTab.ClientID %>").val(selectedTab);
            },
            active: <%= hdnSelectedTab.Value %>
        });
    });
    

    Then in the body, declare your hidden tab field:

    <asp:HiddenField ID="hdnSelectedTab" runat="server" Value="0" />
    

    Basically, on selection of a tab you are storing the selected tabs value in the asp hidden field. Then on show you are retrieving the value.