Opening page with tab preselected that's not the first tab

Question

I have a page with a jqueryui tabset on it. I'd like to be able to open the page with tab other than the first tab selected. If I have four tabs on the page I need to be able to select any of the four to be the 'open' tab.

This maybe a link from another page or a link from a page in the same frameset.

Under the covers everything is PHP.

Answer 1

You'll want to select a tab on the initial load of the page through JavaScript. Here's an example of how to select a tab:

http://docs.jquery.com/UI/API/1.7/Tabs#method-select

<script type="text/javascript">
  $(function() {
    $("#tabs").tabs( 'select' , index )
  });
</script>

Where the index variable is the integer of the tab you want to have selected. It is 0 based, so if you want the third tab selected, you'll want to specify 2 for index.

You'll want to do this once the page is ready:

http://www.learningjquery.com/2006/09/introducing-document-ready

Answer 2

Preselecting a tab can be done with the selected option when initializing the tabs.

$("#tabs").tabs({
    selected: index //index of the tab to be preselected
});

One case where this is important is when the tab at index 0 is loaded with ajax. If you initialize the tabs as usual and then use the select method to change the selected tab, an ajax request will initially be sent to load tab 0. But since you want to show the other tab right away, this request is unnecessary. The selected option allows you to skip this request.