How can i keep the selected tab selected even after postback

c#, jquery

Solution

I think this Code will help you...

<div id="tabs">
        <asp:HiddenField ID="hidtab" Value="0" runat="server" />
        <ul>
            <li><a href="#tabs-1">Tab 1</a></li>
            <li><a href="#tabs-2">Tab 2</a></li>

        </ul>

        <div id="tabs-1">
            <asp:Button ID="Button1" runat="server" Text="Submit" OnClick="Button1_Click"/>
        </div>

        <div id="tabs-2">
            <asp:Button ID="Button2" runat="server" Text="Submit" OnClick="Button2_Click"/>
        </div>
    </div>

<script type="text/javascript">
        $(document).ready(function () {
            var st= $(this).find("input[id*='hidtab']").val();
            if (st== null)
                st= 0;
            $('[id$=tabs]').tabs({ selected: st});
        });
    </script>

protected void Button1_Click(object sender, EventArgs e)
{
    hidtab.Value = "0";
}

protected void Button2_Click(object sender, EventArgs e)
{
    hidtab.Value = "1";
}

Problem

I have some listed tab controls on my aspx form which is as below ``` <div id="tabs"> <ul> <li><a href="#tabs-1">Tab A</a></li> <li><a href="#tabs-2">Tab B</a></li> <li><a href="#tabs-3">Tab C</a></li> </ul> <div id="tabs-1"></div> <div id="tabs-2"><asp:Button ID="someid" runat="server"/></div> <div id="tabs-3"></div> </div> ``` The navigation on mouse click on a tab is done by the following: ``` <script type="text/javascript"> $(function () { $("#tabs").tabs(); }); </script> ``` Now, my question is, How can i maintain the selected tab as it is even after postback. For Example, I select Tab B that contains a Button which causes a postback on click. After the postback occurs Tab A regians the foucs and i have to manually select Tab B for adjuvent operations. Please help me to solve this problem.

Original source

Related problems