Question

i’m using jquery tabs for some of my sites.. for some reason i needed to catch the index of the tab that is actually being selected.when i click some of the tabs, it returns me the tab index, that is formerly selected… is it acting wrong , or am i doing something wrong.
i just need the tab index that i’m actually selecting…

here is the code

    $(function () {
        $("#tabs").tabs({
            create: function (event, ui) {
                return false;
            },
            select: function (event, ui) {
                LoadSalesDetailsFrame($(this).tabs('option', 'selected'));
                // for instance i click the tab with index 5 , it returns the tab index that is already being selected before i select some
            }
        });
    });
    function LoadSalesDetailsFrame(tabIndex) {
        alert(tabIndex);
    } 

Answer 1

try this:

$(function () {
    $("#tabs").tabs({
        create: function (event, ui) {
            return false;
        },
        select: function (event, ui) {
            LoadSalesDetailsFrame(ui.index);
        }
    });
});
function LoadSalesDetailsFrame(tabIndex) {
    alert(tabIndex);
} 

only difference was instead of $(this).tabs(‘option’, ‘selected’), you use ui.index
if you use $(this).tabs(‘option’, ‘selected’), it gets the current selection at the point of time you click the next tab which is actually still the previous tab. you should use the “ui” object passed by the select event instead.