Sunday, February 12, 2012

How to get even on tab selection, and get the currently instead of previously selected tab?


I'm using this snippet to bind on select event:




$("#myTabControl").tabs({
select: function(event, ui){
var selectedTabName = $("#myTabControl").find(".ui-tabs-selected").find("span").text();
// Do stuff with the selected tab name.
}
...
});



The problem is ... I'm getting the name of the tab that was previously selected, not the one that is currently being selected.



Any advice on how to get the latter?



Note - this question is either very similar or a dup ... but I'm not sure it is phrased well enough (I'm not even sure if it's a complete dup or not).

1 comment:

  1. The select event is fired when you click on a tab button. At that moment, the tab has not yet changed.

    You should use the show event:

    $(paneSelector).tabs({
    show: function(e, ui) {
    var selectedTabName = $(paneSelector).find(".ui-tabs-selected span").text();
    }
    });


    DEMO

    ReplyDelete