HTML5 pushState using History.js. Trouble retrieving data from State.data - html

Question

I can set data into the State.data of History.js, like this:
var pushStateData = {};
function RetrieveSearchResults(type, url, searchData) {//, showResetButton,
controlToFocus, navDirection) {
pushStateData = {
SearchType : type,
SearchData : searchData,
};
RetrievePageResults(true, url, pushStateData);
}
function RetrievePageResults(pushNewUrl, url, pushStateData) {
navigationInProgress = true;
if (pushNewUrl) {
if (window.History) {
window.History.pushState(pushStateData, null, url);
}
$.get(url, pushStateData.SearchData, function (reply) {
$("#search-results").html(reply);
navigationInProgress = false;
});
}
If I set a breakpoint on the window.History.pushState statement, in Chrome, I can clearly see pushStateData has the desired values.
However, when I try to retrieve the data:
$(window).bind("statechange", function (e) {
if (!navigationInProgress) {
var State = window.History.getState();
if (window.console && window.console.log) {
console.log("popstate", State, window.location.href);
}
RetrievePageResults(false, State.cleanUrl, State.data);
}
});
When I set a breakpoint on the RetrievePageResults statement,
The State.data object no longer has any of the values I set. State.data is defined, and is not null, but it is an empty object without any apparent values.
Thanks,
Scott

Answer 1

I don't see anything wrong with State.data, when you issue a pushState, make sure you call the History.js method:
History.pushState({state:1}, "State 1", "?state=1");
Where:
First Parameter => The data
Second Parameter => The name
Third Parameter => The url
It seems your not passing the state, and the data will only be present if and only if you call the History.pushState. When your visiting the URL directly (/?state=1) you would have no data in the state, data will only be available when navigating back/forward while pushing state via History.pushState.
side note: Make sure your navigationInProgress variable is fixed, you don't want it to be stalled there. Reset it when the $.get request failed when listening on the error callback. And when your pushNewUrl is false, reset the navigationInProgress attribute.