Jquery Tool: Keep selected tab on refresh or save data

Question

I am using jquery tool for tab Ui,

Now I want to keep tab selected on page reload. Is there any way to do that? below is my code

$(function() {
    // se         


        

Answer 1

This is what worked for me... at least I haven't run into any issues yet:

$('#tabs').tabs({
            select: function (event, ui)
            {
                $.cookie('active_tab', ui.index, { path: '/' });
            }
        });
$('#tabs').tabs("option", "active", $.cookie('active_tab'));

I'm using: jQuery 1.8.2, jQuery UI 1.9.1, jQuery Cookie Plugin.

I set the "path" because in C# I set this value in a mvc controller which defaults to "/". If the path doesn't match, it wont overwrite the existing cookie. Here is my C# code to set the value of the same cookie used above:

Response.Cookies["active_tab"].Value = "myTabIndex";

Edit: As of jQuery UI 1.10.2 (I just tried this version, not sure if it's broken in previous versions), my method doesnt work. This new code will set the cookie using jQuery UI 1.10.2

 $('#tabs').tabs({
     activate: function (event, ui) {
         $.cookie('active_tab', ui.newTab.index(), { path: '/' });
     }
 });