Randy Minder
Randy Minder

Reputation: 48402

jQuery Tabs - Unable to trap tab click

I am trying to trap the jQuery tab click event as follows:

$('#statisticsTab').tabs({
    activate: function (event, ui) {
        alert("In activate!");

        var $activeTab = $('#statisticsTab').tabs('option', 'active');
        if ($activeTab === 1) {
            alert("Tab 1 is active!");
        }
        else if ($activeTab === 2) {
            alert("Tab 2 is active!");
        }
        else if ($activeTab === 3) {
            alert("Tab 3 is active!");
        }
    }
});

The tab control itself works perfectly but none of the alerts in this code ever fire when I click on the various tabs. I'm using jQuery 1.10.2.

Upvotes: 0

Views: 73

Answers (1)

Wilmer
Wilmer

Reputation: 2511

Per request of the OP here's a slightly improved version and the fiddle that helped identify the problem:

$('#statisticsTab').tabs({
    activate: function (event, ui) {
        alert("In activate!");

        var $activeTab = ui.newTab.index();
        if ($activeTab === 1) {
            alert("Tab 1 is active!");
        }
        else if ($activeTab === 2) {
            alert("Tab 2 is active!");
        }
        else if ($activeTab === 3) {
            alert("Tab 3 is active!");
        }
    }
});

FIDDLE

Upvotes: 1

Related Questions