Question

I’m using the tabs control in jquery ui. I add new tabs dynamically based on some kind of logic with the following code:

$("#div_Tabs").tabs("add", "/Game/PlayGame?matchID=" + result.MatchID, "Play with " + userName);

My problem is that when the user navigates away from the newly created tab, the content of that tab is lost, and when he selects this tab again, everything is loaded back again. I wonder if this reloading can be avoided. I want to load that content only once, when a new tab is created. If this cannot be done, what other alternatives do I have? Thanks in advance.

Answer 1

What about setting the ‘cache’ attribute to TRUE? According to documentation:

Whether or not to cache remote tabs
content, e.g. load only once or with
every click. Cached content is being
lazy loaded, e.g once and only once
for the first click. Note that to
prevent the actual Ajax requests from
being cached by the browser you need
to provide an extra cache: false flag
to ajaxOptions

The tab is going to have the behaviour that you described only once.