Jquery $("#tabs").tabs( "remove" , x );

[ALFA-FOXTROT]

I have this code in the general js file.

$("#tabs").tabs({
        collapsible: true,
        cache: true,
        ajaxOptions: {
            error: function(xhr, status, index, anchor) {
                $(anchor.hash).html("Couldn't load this tab. We'll try to fix this as soon as possible. If this wouldn't be a demo.");
            }
        }
    });

And

$("#tabs").tabs( "remove" , 2 );

In the TABs (see Picture):
INDEX "0" (Display Categories)
INDEX "1" (Add Category)

I use "cache" so that I don't loose the search results of INDEX "0" when the user comes back to the TAB case he when to another TAB.

In INDEX "0" if user click "UPDATE" icon TAB INDEX "2" (EDIT) is created.

But I need to get TAB (INDEX 2) closed when the user leaves that tab, and with CACHE: TRUE the $("#tabs").tabs( "remove" , 2 ); doesnt work.

How can I put something like.

if EXIT TAB 2 then REMOVE.... without the CACHE interfering?

Can anyone help me?

[IMG]http://www.drosendo.com/tabsremove.jpg[/IMG]

[ALFA-FOXTROT]

Anyone can help in this matteR?

[Airshow]

This is a shot in the dark ....

Try remembering the jQuery object to which the tabs are first applied:

var $tabs = $("#tabs");
$tabs.tabs({
  collapsible: true,
  cache: true,
  ajaxOptions: {
    error: function(xhr, status, index, anchor) {
      $(anchor.hash).html("Couldn't load this tab. We'll try to fix this as soon as possible. If this wouldn't be a demo.");
    }
  }
});

Then when it comes to remove the tab, use the same jQuery object rather than creating a new one.

...
$tabs.tabs("remove", 2);
...

You need to ensure that $tabs remains in scope. This should not be a problem if all your jQuery functionality is defined inside a $(document).ready(...) structure with var $tabs at its outermost level.

May not work but give it a try.

Airshow

[ALFA-FOXTROT]

Thanks again AIRSHOW.

Will try, and post back...

[ALFA-FOXTROT]

Where goes a Solution:

$("#tabs").tabs({
        cache: true,
        ajaxOptions: {
            error: function(xhr, status, index, anchor) {
                $(anchor.hash).html("Couldn't load this tab. We'll try to fix this as soon as possible. If this wouldn't be a demo.");
            }
        },
        load: function(event, ui) {
            $.unblockUI();
        },
        add: function(event, ui) {
            //select newely opened tab
            $(this).tabs('select',ui.index);
            //load function to close tab
            
        },
        show: function(event, ui) {
            //load function to close selected tabs
            //removetab($(this), ui.index);

           if(ui.index!=2){
                $("#tabs").tabs( "remove" , 2 )
            }

        }

    });