I have multiple sets of tabs on a page. In each case, the first tab
contains an image (of a data chart), and the second tab contains an
accessible data table.
My call is:
$("ul.tabs").tabs({ fx: {height: 'toggle', duration: 350 }});
This is working perfectly, but I would really like to be able to click
the image inside the first tab (in each set), and activate the second
tab (so the user can "drill down" into the chart to see the numbers
behind it).
The documentation says you can do this using this kind of thing:
var $tabs = $('#example').tabs(); // first tab selected
$('#my-text-link').click(function() { // bind click event to link
$tabs.tabs('select', 2); // switch to third tab
return false;
});
But this assumes that there is only one set of tabs ("#example"). I
want to be able to click on a link inside a tab, and have it work out
which set of tabs it's contained within, and select the 2nd tab in
that set.
Is that possible? Something like:
$('a.tableLink').click(function() {
var $tabs = ((( some way of determining which tab set
))).tabs();
$tabs.tabs('select',1);
return false;
});
My HTML structure is:
<div class="chartWrap">
<ul class="tabs">
<li><a href="#cc" title="Chart C">Chart</a></li>
<li><a href="#ct" title="Table C">Table</a></li>
</ul>
<div id="cc"><a href="#ct" class="tableLink"><img
src="path_to_chart.gif" /></a></div>
<div id="ct">
((( data table )))
</div>
</div>
Not sure I've explained this very well...
Thanks,
Mike
--~--~---------~--~----~------------~-------~--~----~
You received this message because you are subscribed to the Google Groups
"jQuery UI" group.
To post to this group, send email to [email protected]
To unsubscribe from this group, send email to
[email protected]
For more options, visit this group at
http://groups.google.com/group/jquery-ui?hl=en
-~----------~----~----~----~------~----~------~--~---
