Ajax Tabs Default Tab

[magicstasis]

1) Script Title: Ajax Tabs Content

2) Script URL (on DD): http://www.dynamicdrive.com/dynamici...axtabscontent/

3) Describe problem: The Ajax Tabs work great except for one small thing. Whenever I load the page without any sessions vars set, nothing loads at all. I see the tabs but I have to manually click one of them for the div to load. I've pasted my code below and as you can see I have set one of the li's with the class of "selected." Anyone else run into this problem or have any ideas? Thanks.

<li class="selected"><?php echo $html->link('Downloads','/bbxcatalogstories/catalog/?type=file', array('rel'=>'ajaxcontentarea')); ?></li>

[ddadmin]

I can't tell what you're trying to do in PHP with the below, but the problem most likely is with your PHP, not Ajax tabs:

<li class="selected"><?php echo $html->link('Downloads','/bbxcatalogstories/catalog/?type=file', array('rel'=>'ajaxcontentarea')); ?></li>

Are you trying to dynamically output the text of each tab? In other words, the part in red:

<li><a href="external.htm" rel="ajaxcontentarea">Bird</a></li>

[magicstasis]

The PHP code is just a helper from the CakePHP framework which I'm using. It simply generates a link tag in that space. I've also tried it with straight html code and it still does not automatically load the "selected" tab upon page load. I'm not trying to load the text of the tabs. I just want to load this page when the tabs are loaded by default. Thanks.

<li class="selected"><a href='/alpha/bbxcatalogstories/catalog/?type=file' rel="ajaxcontentarea">Downloads</a></li>

[ddadmin]

If all you're looking to do is get a particular tab and its external content to load automatically when the page loads, just use the class="selected" declaration inside the tab in question, for example:

<ul id="maintab" class="shadetabs">
<li><a href="#default" rel="ajaxcontentarea">Intro</a></li>
<li class="selected"><a href="external.htm" rel="ajaxcontentarea">Bird</a></li>
<li><a href="external2.htm" rel="ajaxcontentarea">Dog</a></li>
<li><a href="external3.htm" rel="ajaxcontentarea">Cat</a></li>
<li><a href="external4.htm" rel="ajaxcontentarea" rev="content.css, content.js">Sea Otter</a></li>
</ul>

This will cause the second tab to be loaded by default.

[magicstasis]

Right, I did that already and it doesn't load the tab. I guess I wasn't clear enough with the problem explanation. I have labeled one of my <li> elements with the class="selected" as shown in my code above but on page load, the tab itself seems to be selected but nothing is loaded in the content div. It's simply blank. Has anyone else run into this problem?

[ddadmin]

Make sure:

var enabletabpersistence=1

in the .js file is set to 0, to disable persistence. Also, is the external file referenced in the <li> element properly defined and exists? Maybe a link to the problem page would be helpful.

[magicstasis]

Thanks ddadmin for the help. The disabling of the tab persistence did the trick. So is it designed that if I want tab persistence, there is no way for me to load one of the tabs by default?

[ddadmin]

Ah ok I see there's a bug with the persistence feature that's causing the issue you're having. Try the modified .js file attached below and turn on persistence as well.

[magicstasis]

Thanks a lot! Worked like a charm. Loading the default tab + persistence. Thank you for looking into it for so long, much appreciated.