Loading a page into the tab, and selecting the correct tab?

I have a page which contains JQuery tabs (taken straight from the Jquery API)

My JQuery function:

                // Tabs                
                    select: function(event, ui) {
                        var url = $.data(ui.tab, 'load.tabs');
                        if( url ) {
                            location.href = url;
                            return false;
                        return true;

Open in new window

My Page
<div id="tabs">
                        <li><a href="index.xhtml">Home</a></li>
                        <li><a href="#tabs-1">Products</a></li>
                        <li><a href="latest.xhtml">Latest</a></li>
                    <div id="tabs-1">
.... This tabs contents....

Open in new window

The problem I am having is that when I click a tab it loads the page but the 1st tab is always selected.

How do I set the index based on the page I've selected

Who is Participating?
RobConnect With a Mentor Owner (Aidellio)Commented:
have you tried with cookie persistence?  That way when the page reloads the tab is remembered

double check you have the right number of end tag (or start)


directxBOBAuthor Commented:
I've double checked them in all files.
RobOwner (Aidellio)Commented:
see here for a working version: http://jsfiddle.net/rjurd/KWDsK/

Question has a verified solution.

Are you are experiencing a similar issue? Get a personalized answer when you ask a related question.

Have a better answer? Share it in a comment.

All Courses

From novice to tech pro — start learning today.