On Sep 10, 10:39 pm, Brad <[EMAIL PROTECTED]> wrote:
> I have a page with 5 ajax tabs on it. I've set it up like this:
>
> $(document).ready(function(){
>
> var shiptabs = $("#tabarea > ul").tabs(
> { selected: 0
> , disabled:[2]
> , spinner:''
> , cache:true
> , ajaxOptions: { cache: false }
> , load: function(e,ui) {
> handleTabLoad(ui);
> }
> , select: function(e,ui) {
> handleTabSelect(ui);
> }
> , show: function(e,ui) {
> handleTabShow(ui);
> }
> });
>
> ...
>
> });
>
> Notice that I've defined load, select and show functions which I've
> name handleTabLoad( ), handleTabSelect( ), and handleShow ()
> respectively.
>
> For example, handleTabLoad will need to bind some click events to
> links that will allow the user to go to a different tab.
>
> Therefore I need to do something like
>
> $('#locations_tab_link").bind("click",
> function(){
> foo.tabs('select',LOCATIONS_TAB);
> return false; // don't submit form
> }
> );
>
> My problem is that I can't determine how to get 'foo' from within
> handleTabLoad().
>
> If I follow the examples in the documentation and try this...
>
> var $tabs = $('#example > ul').tabs(); // first tab selected
>
> $('#locations_tab_link").click(function() {
> $tabs.tabs('select', LOCATIONS_TAB);
> return false;
>
> });
I were suggesting this, but I'm also thinking that it may make sense
to attach the jQuery object to the ui object passed to the callback.
> ... it appears that the tab control is re-initialized. That totally
> breaks the web app.
That shouldn't be the case and isn't on my test page. Do you use
latest versions (even though I'm not aware of any related bug)?
You can try the following though (traverse from tab to its parent ul
element):
function handleTabLoad(ui) {
$('#locations_tab_link').bind('click',
function() {
$(ui.tab).parents('ul:first').tabs('select',
LOCATIONS_TAB);
return false; // don't submit form
}
);
}
By the way, you don't really need to wrap another anonymous function
around handleTabLoad etc. As you already have a named function that's
a perfect reference:
...
load: handleTabLoad,
select: handleTabSelect,
...
You then only need to adapt the function arguments:
function handleTabLoad(e, ui) {
...
}
--Klaus
--~--~---------~--~----~------------~-------~--~----~
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
-~----------~----~----~----~------~----~------~--~---
