Keeping Tab open on postback
<p>Hi i have some tabbing which works fine, however on postback the tabbing opens two at once. I was wondering how i can  fix this issue. Here is the javascript i used;</p>

<pre><code>$(".tab_content").hide(); 

    $("ul.tabs li:first").addClass("active").show(); 

    $(".tab_content:first").show();     

    $("ul.tabs li").click(function() {

        $("ul.tabs li").removeClass("active"); 

        $(this).addClass("active"); 

        $(".tab_content").hide(); 

        var activeTab = $(this).find("a").attr("href"); 

        $(activeTab).fadeIn(); 

        return false;

    });



    $('#texttab').click(function() {        

        $(".tab_content").addClass("heightone");    

        $(".tab_content").removeClass("heighttwo");

        $(".tab_content").removeClass("heightthree");

        $('#tabscontainer').addClass("hone");   

        $('#tabscontainer').removeClass("htwo");

        $('#tabscontainer').removeClass("hthree");  

    });



    $('#imagetab').click(function() {       

        $(".tab_content").addClass("heighttwo");    

        $(".tab_content").removeClass("heightone");

        $(".tab_content").removeClass("heightthree");

        $('#tabscontainer').addClass("htwo");   

        $('#tabscontainer').removeClass("hone");

        $('#tabscontainer').removeClass("hthree");

        $(".tab_container").css("height","650px");

    });
</code></pre>

<p>I tried using this piece of code to maintain it on postback however it does not work;</p>

<pre><code> $(function() {
        $("#tabscontainer").tabs({
            show: function() {
                var sel = $('#tabscontainer').tabs('option', 'selected');
                $("#&lt;%= HFCurrTabIndex.ClientID %&gt;").val(sel);
            },
            selected: &lt;%= HFCurrTabIndex.Value %&gt;
        });
    });
</code></pre>

<p>HTML</p>

<pre><code> &lt;div id="tabscontainer"  class="hone"&gt;

                     &lt;ul class="tabs"&gt; 
                            &lt;li&gt;&lt;a href="#tab1" id="texttab"&gt;Text Update&lt;/a&gt;&lt;/li&gt; 
                            &lt;li&gt;&lt;a href="#tab2" id="imagetab"&gt;Text &amp;amp; Image Update&lt;/a&gt;&lt;/li&gt; 
                    &lt;/ul&gt; 

                     &lt;div id="tab1" class="tab_content"&gt;

                    &lt;div align="center"&gt;&lt;asp:Button ID="lbtnUpdate" Text="Update" CssClass="button" OnClick="lbtnUpdate_Click" runat="server"&gt;&lt;/asp:Button&gt;&lt;/div&gt;                        

                    &lt;/div&gt; &lt;!-- tab1 --&gt;
                     &lt;div id="tab2" class="tab_content"&gt;               

                    &lt;span class="clear"&gt;&lt;/span&gt;

                    &lt;div align="center"&gt;&lt;asp:Button ID="lbtnUpdateImage" Text="Update" CssClass="button" OnClick="lbtnUpdate_Click" runat="server"&gt;&lt;/asp:Button&gt;&lt;/div&gt;                        
             &lt;/div&gt; &lt;!-- tab2 --&gt;

         &lt;/div&gt;&lt;!-- tabscontainer --&gt;
</code></pre>
