AJAX - The Complete Reference

464 Part II: Developing an Ajax Library^

var doc = iframe.contentWindow.document;

doc.open();

doc.write(html);

doc.close();

Now, the items necessary to reset a page to its desired state must be saved, so they are

persisted using very browser-specific mechanisms. Here the persistence div is found, and a

call is made to another new library AjaxTCR.storage.add(). This function is passed a

key, a value, the persistence element, and the store name. Note we save the request, title,

and history position here.

var persistDiv = doc.getElementById("persistDiv");

AjaxTCR.storage.add("request", optionsString, persistDiv, safeStateName);

if (title)

AjaxTCR.storage.add("title", title, persistDiv, safeStateName);

AjaxTCR.storage.add("position", AjaxTCR.history._historyPosition, persistDiv,

safeStateName);

}

If this were another browser, the same mechanism would be called, passing it the same

items without the IE-specific items.

else if (safeStateName)

{

AjaxTCR.storage.add(safeStateName, optionsString);

if (title)

AjaxTCR.storage.add(safeStateName + "title", title);

AjaxTCR.storage.add(safeStateName + "position",

AjaxTCR.history._historyPosition);

}

Finally, for housekeeping purposes, the internal history stack is adjusted to mimic the

browser’s history. Normally this is just a matter of pushing an item to the stack. However,

in some cases, a user may back up a few items and then push a new item that would

eliminate the existing forward values.

/* Finally push onto history stack */

var historyItem = {id: AjaxTCR.history._currentState, title: title};

var diff = AjaxTCR.history._history.length - AjaxTCR.history._historyPosition + 1;

if (diff > 0)

AjaxTCR.history._history.splice(AjaxTCR.history._historyPosition-1,diff);

AjaxTCR.history._history.push(historyItem);

},

Now we go back and observe that when init() is called, it starts a timer to watch the

current state every 500 ms. In the case of Firefox, it simply checks this value via the hash

location. In the case of Internet Explorer, it looks in the hidden iframe at the currentState

<div> that was added. In either approach, if it sees the value is changed, it grabs the title,

options, and position from persisted data storage using the new value. In the case that the

history is set via the sendRequest() mechanism, depending on if the response has been