JQuery UI Tabs, Change tab URL (JQuery 1.10+)

Question

Is there a way to modify the link to a tab in jquery ui through jquery/javascript?

Sample problem is like

A tab have URL "http://thanksforyourhelp/greatly/appreciated/"

If a form is submitted on that tab, data is written to the database. The response gives an ID of the row added to the database.

Next time that specific tab is visited the link should actually be

'http://thanksforyourhelp/greatly/appreciated/ID' 

where the ID is now known since the response from the form (ajax here as well) sent it back. When this response came I've to reload the current tab with the URL having ID in it.

Prior to JQuery 1.10. We can do something like this

$("#tabs").tabs("url", index, url);

how we can do this in JQuery UI 1.10+. As URL method is removed in JQuery 1.10?

Answer 1

The tab definition triggered errors for me; Had to rewrite it like this:

var tab = $(tabs.data()['ui-tabs'].tabs[currentTabIndex]);

Answer 2

Do something like this in the complete of form submit. This will change the URL of currently active tab and reloads the tab.

var tabs = $("#tabs");
var currentTabIndex = tabs.tabs("option", "active");
var tab = $(tabs.data('uiTabs').tabs[currentTabIndex]);
tab.find('.ui-tabs-anchor').attr('href', "http://thanksforyourhelp/greatly/appreciated/ID");
// If cached initially. Remove cache then
tab.data( "loaded", false);
tabs.tabs("load", currentTabIndex);