jQuery Forum

You can change a tab's href with the tabs('url') method:
http://docs.jquery.com/UI/Tabs/tabs#.22url.22indexurl
--Klaus

Good plan, thanks. Leaves me with some sequencing issues to work out
in this app's UI, and I'm good to go.

Hmmm, something odd is going on here. (Sorry for the detail, it's
necessary.)
Here's my first version of the function bound to the Edit link in a
list of items (only adjusting the url of the first tab, for now):
function edit(objID)
{
    $('#editTabs')
        .tabs('url', 0, '?cmd=Type.edit&objID=' + objID)
        .tabs('select', 0);
    $('#editDlg').dialog('open');
}
The dialog containing the tabs is embedded in the list page; here are
the relevant options passed to tabs():
selected: null,
cache: false,
ajaxOptions: {cache: false}
On one machine, it works fine. The edit dlg opens pointed at the item
with the passed ID, both the first time you open the dlg, and after
closing that and clicking Edit on a different item.
On another machine, it's correct the first time, but after closing the
dlg and clicking Edit on a different item, the first one you edited is
still there. It's correct after manually selecting a different tab,
then reselecting the first one again.
In firebug I can see the first-level cause: No ajax call is made when
I click Edit the second time. Once the dlg is open, manually selecting
another tab and going back to the first one does cause the ajax
request to fire, which is why the correct data is shown at that point.
When I do this instead:
function edit(objID)
{
    $('#editTabs')
        .tabs('url', 0, '?cmd=Type.edit&objID=' + objID)
        .tabs('select', 0)
        .tabs('load', 0);
    $('#editDlg').dialog('open');
}
...it looks like it works correctly, but behind the scenes, the first
time the dlg opens two identical ajax requests are sent. My guess is
that one of those is from the select, and one from the load. After
that, only one goes out.
I've tried removing the load call, and attempting to deselect all tabs
before selecting the first one, so selecting it programmatically loads
its content. I tried tabs('select', null), tabs('select', -1), or
tabs('select', 99), but nothing appears to force the content to load
every time. Is there some other way to invalidate the existing content
on a tab, so selecting it does a load, even if it was previously
loaded?
The only option I've thought of is to keep a global flag that tracks
if the dlg has even been opened since pg load, and only call load() if
it's not the first time.
It seems like things should be more automatic than this. Is it a bug?
am I missing some obvious way you're supposed to manage remote tabs?
Thanks again, as always.

I guess the problem is that you simply cannot select an already
selected tab, thus no Ajax call. If you do just nothing will happen.
That's what the load method is for actually. (You won't have to do
anything for in-page-tabs).
Thus in the one case load happens twice as you already guessed
correctly, once for load and once for select.
Please note that closing and reopening a dialog will not trigger
anything tabs related automagically.
In short: if you want to manually update an already selected tab, you
need to use the load method. For an unselected tab the select method
will take care of everything.
--Klaus

Thanks for your help here Klaus, and sorry again for the length...
Here's the behavior I'm after:
- A list of records with edit links on each.
- Clicking one opens a dialog containing a tab set. Each tab contains
an ajax form for editing different aspects of that record.
- The last tab you view is remembered in a cookie, and displayed the
next time you edit.
For this to work, some things have to happen when you click edit:
- The url of each tab needs to be adjusted to use the ID of the
clicked item.
- "After" that, the last tab you viewed needs to get loaded and
selected.
- Once a tab is loaded, its form needs to be ajaxForm'd.
- The dialog needs to be shown.
Ideally, the dialog and the tab set get created when the list pg
loads, and reused from then on.
I've got all this working, except for problems with the initially
selected tab:
- If the tabs are defined with
    selected: getLastEditTab()
...the tab looks selected, but as you'd logically expect, an ajax
call to load the last selected tab gets made when the pg loads. This
is useless, because no item has been chosen to edit, so the tab urls
don't have a real item ID to work with. Not ideal, but not horrible,
probably ok enough if there's no better way.
- If instead the tabs are defined with
    selected: null
...the last selected tab doesn't appear selected when the page first
opens. It loads, but even though I've explicitly selected it after
updating the tab urls, and after the original call to tabs(), all tabs
appear unselected. Using selected: null must force all tabs to be
deselected, in some way that takes effect after I explicitly select
the one I want, even though my select() code runs later.
Calling tabs('select', lastTab) in the onTabLoad callback does make
the tab look selected, but two ajax calls get made when you select a
new tab, and three the first time you edit. I couldn't find any
callback point that made the tab look selected without additional
loads.
What I think I really need is to define the tab object in such a way
that it doesn't try to manage loading, selecting, or deselecting any
tabs at all intially -- just let me do it. Setting selected: null
forces all tabs to be deselected, and an out of range tab index throws
an error. Is there some way to achieve this that I don't know about?
There's another issue, with a workaround. In either case above, if any
tab except [0] is the most-recently-used tab I select, that tab, *and
all tabs to the right of it* get the 'ui-tabs-loading' class applied
to them during load. Again not ideal, but not horrible, probably ok
enough if there's no better way. This seems like a bug.
In some situations that I haven't quite pinned down, all those tabs
end up selected-looking when the loading class is removed, and stay
that way until you manually choose another tab. That's pretty bad.
Worked around it by using this to load a tab:
    function loadAndSelectTab(tabObj, index)
    {
        tabObj.tabs('load', index);
        tabObj.children('li:not(:eq(' + index + '))').removeClass('ui-tabs-
selected');
    }
I tried a bunch of other things, none as successful, so I'm living
with the extra ajax call on pg load, and manually adjusting the tab
selection classes.
Thanks again for any help, Klaus and others.

Sparkpool,
I'm sorry, from this description alone it is too hard for me
understand what you need to do and if there is a bug or if it is just
unintended usage.
I think it would be much easier too see some actual code, e.g. if you
would post a demo...
--Klaus