jquery ui tabs need to empty the prev tab when we move to next tab

Question

hi ,

i jus made a script to empty the prev selected tab its working fine when we switch from 1 to 2 to 3.

but bad luck its not working when we switch frm 3 to 2 to 1.here is the script

var prevTab = 0;
jQuery("#tabs").tabs({ fx: { opacity: "toggle" },
cache: false,
show: function(event, ui) {
alert(prevTab);
         var prevTab = ui.index;
   jQuery("#ui-tabs-"+prevTab).empty();  //set the new previous tab index to the    current index
 }

});

since i have form in each tab i got conflict so i need to empty prev tab content.

Thanxs for ur helping hand, Gobi:)

Answer 1

You're creating a new local variable inside the callback function by doing var prevTab = ui.index. This way, the value is lost when you exit the function (and its scope). Use the existing prevTab instead of declaring a new instance and it should be fine

var prevTab = 0;
jQuery("#tabs").tabs({
    fx: { opacity: "toggle" },
    cache: false,
    show: function(event, ui) {
        alert(prevTab);
        prevTab = ui.index; //no var
        jQuery("#ui-tabs-"+prevTab).empty();
    }
});