CODEWITHSUNDEEP
jqueryjquery-uijquery-ui-tabs
Evanss
Evanss

Reputation: 23553

Set active tab by clicking a link thats outside of the tabs?

Im using the jQuery UI Tabs: http://api.jqueryui.com/tabs/

How can I make a link on my page thats outside of the tabs, when clicked make a certain tab active? Thanks

Upvotes: 3

Views: 20170

Answers (5)

amedriveroperez
amedriveroperez

Reputation: 13

Try this:

<li ....> 
     <a href="#tab-number">Tab Title</a>
</li>

and them your url look like this: "[URL]#tab-number"

I hope help you.... Regards...

Upvotes: 0

Shwet
Shwet

Reputation: 1868

$( "#tabs" ).tabs({ active: tabNumber });

tabNumber starts with 0

Upvotes: 1

Igor Semkiv
Igor Semkiv

Reputation: 361

In IE10 option 'active' not work. I use instead of 'active' option 'selected'. 

$( ".selector" ).tabs( "option", "selected", <number of tab> );

Upvotes: 2

Evanss
Evanss

Reputation: 23553

Ive marked @Secator's answer as correct as I can see from the documentation hes right. However for some reason it didnt work for me so instead I 'manually' simulated a click on the tab: 

        $("#myTrigger").click(function(e) {
              $("#id-of-normal-tab-link").click();
              e.preventDefault(); //prevent default behavior of the a#myTrigger 
        });

Upvotes: 1

Mariusz Jamro
Mariusz Jamro

Reputation: 31633

See http://api.jqueryui.com/tabs/#option-active

To get current active tab index:

var currentActive = $( ".selector" ).tabs( "option", "active" );

To set current active tab:

$( ".selector" ).tabs( "option", "active", <number of tab> );

For example:

$('a').click(function(){
         $( ".tabs" ).tabs( "option", "active", 2 );
});

Upvotes: 8

Related Questions