Question

52

JQuery UI tabs: How do I navigate directly to a tab from another page?

rated 0 times [ 57] [ 5] / answers: 1 / hits: 19379 / 15 Years ago, wed, march 31, 2010, 12:00:00

JQuery UI tabs are implemented by named anchors in an unordered list. When you hover over one of the tabs you can see this in the link shown at the foot of the browser:

http://mysite/product/3/#orders

Above would be the orders tab for example. JQuery obviously intercepts the click to this anchor and opens the tab instead.

However if I bookmark the link above or link to it from elsewhere in the site the page does not open on the specific tab.

In the tab initialisation block I was considering putting in some code that looks for a named anchor in the URL and, if it finds one, does an index lookup of the tabs and calls the select on it. This would mean it will still work with JS switched off.

But is there an easier/nicer/better way?

Answers

Only authorized users can answer the question. Please sign in first, or register a free account.

luizc

Add To Favorites

Follow

Total Points: 623

Total Questions: 87

Total Answers: 103

Location: Zimbabwe

Member since Sat, Feb 27, 2021

3 Years ago

answered 15 Years ago maxh · Accepted Answer

Found this example here:

if(document.location.hash!='') {

    //get the index from URL hash

    tabSelect = document.location.hash.substr(1,document.location.hash.length);

    $(#my-tabs).tabs('select',tabSelect-1);

}