1

I know this question have been asked several times, but any of the answer solved my problem till now. If I have a tab component form Jquery, whose title names for each tabs are Tab1: Marc, Tab2: Paul, Tab3: John, how I can get in a alert e.g, the title (text) of the current selected tab? For example: if the selected tab the first one is "Marc", I want to get in a alert "Marc" and not 0 as index of the tab. The following was what I tried but is not working

function getSelectedTabText() { 
        return $("#tabs").tabs('option', 'active').text();
    }

The text of each tab is loaded from the DB with PHP without any problem, I can get my Tab component with the name of each tab correct loaded.

Community
  • 1
  • 1
zgrizzly_7
  • 773
  • 2
  • 10
  • 22

3 Answers3

4

The active tab has a ui-tabs-active class appended, so you can just match against that:

function getSelectedTabText() { 
    return $("#tabs .ui-tabs-active").text();
}

Example fiddle: https://jsfiddle.net/wyeeestk/

blgt
  • 8,135
  • 1
  • 25
  • 28
  • Ahh great, this half working! Because I loaded my text from a Db and the text is not fix, so this code is only working when I set a fix text in the html declaration eg: How can be in the case that I have a dynamic text? – zgrizzly_7 Dec 16 '15 at 09:31
  • You have to wait until after the data has been retrieved from the server to get the text. After that, you need to re-do the callbacks using it every time you update the server data. There's no simple "use whatever's in the server at this point" option, it will depend on your use case. Add more details and i could try to be more helpful – blgt Dec 16 '15 at 09:48
  • @zgrizzly_7 : call `getSelectedTabText` in ajax success – Cerlin Dec 16 '15 at 09:51
1

Do you want something like this?

$('.testbtn').click(function(){
    text = $('#tabs').find('.ui-tabs-active').text();
    alert(text);
});
Kevin
  • 61
  • 3
0

I've not tested this but...

function getSelectedTabText() {
        var active = $("#tabs").tabs('option', 'active');
        return $($("#tabs li")[active]).text();
}

I think the only reason other questions aren't working is because "selected" has been replaced by "active", but I could be wrong.

Sworrub Wehttam
  • 588
  • 4
  • 14