UI.tabs - bug in Ajax loading?
When using UI Tabs with mixed AJAX tabs there seems to be a bit of a
bug in the handling of default selected tabs.
I'm starting with a page containing a fragment like this:
<ul class="ui-tabs-nav">
<li><span><a href="/">Calendars</a></span></li>
<li><span><a href="/city">Cities</a></span></li>
<li class="ui-tabs-selected"><span><a href="#workshops">Workshops</
a></span></li>
<li><span><a href="/not-even-likely.html">Test</a></span></li>
</ul>
<div id="workshops">
Blah
</div>
... and a behavior.js file containing:
jQuery.noConflict();
jQuery(function(){
jQuery('.ui-tabs-nav').tabs(); // Enable tabs
alert(jQuery('.ui-tabs-nav').tabsSelected()); // Alert with # of
currently selected tab
});
What I'm expecting:
The "Workshops" tab should be selected on load, with the content
provided in the HTML document ("Blah") visible. An alert box should
pop open telling me that tab #2 is currently selected.
What I'm getting.
The "Workshops" tab is enabled, and an alert box tells me that tab #2
is currently selected. However, the page immediately triggers an AJAX
load of the first list item (the "/" address) and displays that
content instead, leaving the "workshops" content invisible. In other
words, the pane that is being displayed is NOT the pane associated
with the currently selected tab.
Is this a bug? Or am I misunderstanding usage of the plugin? I
grabbed the latest version of ui.tabs.js from trunk and it still seems
to occur.