Jquery UI Tabs Enable/Disable events not firing

Question

I am trying to toggle a series of navigation buttons to react when I disable/enable tabs. However the tabs enable and disable methods don't seem to be firing them (or perhaps the binding is wrong).

This works:

$('body').on('tabsload', '.tabContainer', function (event, ui) {
   $(ui.panel).find(".tab-loading").remove();
});

This does not work:

$('body').on('tabsenable', '.tabContainer', function (event, ui) {
   debugger;
});
$('body').on('tabsdisable', '.tabContainer', function (event, ui) {
   debugger;
});

I am enabling the tabs this way:

$tabContainer.tabs('option', 'disabled', []);

Does this not fire an event? Thanks.

Answer 1

I think the error is set the option disabled and not call a method.

Try this:

$(".tabContainer").tabs('enable');
$(".tabContainer").tabs('disable');

And:

$(".tabContainer").bind("tabsenable", function(event, ui){
    // action...
});

$(".tabContainer").bind("tabsdisable", function(event, ui){
    // action...
});