Change selected jQuery UI tab tab

Question

The question was asked several times earlier, but none of them resemble my scenario.

I have a jQuery tab control that loads my tabs through ajax:

<div id="tabs"> <ul> <% if (AccessControll.HasAccess(Url.Action("ViewSchemeInformation","Scheme"))){%> <li><a id="tab_1" href="<%= Url.Action("ViewSchemeInformation","Scheme", new {schemeNumber = Model.SchemeNumber}) %>">Information</a></li> <%}%> <% if (AccessControll.HasAccess(Url.Action("SchemeUpdate", "Scheme"))){%> <li><a id="tab_2" href="<%= Url.Action("SchemeUpdate","Scheme", new {schemeNumber = Model.SchemeNumber}) %>">Update</a></li> <%}%> <%if (AccessControll.HasAccess(Url.Action("MinimumRequirements","Scheme"))){%> <li><a id="tab_3" href="<%= Url.Action("MinimumRequirements","Scheme", new {schemeNumber = Model.SchemeNumber}) %>">Minimum Requirements</a></li> <%}%> </ul> 

These tabs are displayed based on access, so my tab index is never the same, so I added an id for each href .

I link to this particular page from different places, and each link should go to this page and select the tab that it links to.

My url will look something like this: http://localhost:34412/Scheme/ViewSchemeDetails/BS-000469800000?activeTab=1

How can I select a tab using jQuery based on the activeTab parameter in my string?

Note that the number in querystring always matches the id of my href .

Answer 1

Get the query string:

 var queryString = window.location.search; 

Get the activeTab part:

 var activeTab = queryString.match(/\bactiveTab=([^&]*)/)[1]; 

Select the tab with the correct ID:

 $('#tab_' + activeTab).click(); 

Answer 2

 tabs_object.tabs('widget').tabs("option", 'selected', 2); 

in your case

 tabs_object.tabs('widget').tabs("option", 'selected', activeTab);