Can I save serialized form data?

In my continued effort to understand hash tags and page navigation I'm hitting a road block with resubmitting form data if a user uses the browsers navigation buttons (e.g. back and forward).

My function that uses the form data is below:

if(page == "/visits_results") {

    $('#start').val(start);

    $.post("visits_results.php", $("#profile_form_id").serialize(),
    function(data) {
        $('#search_results').html(data);
        location.href = "#visits_results=" + start; 
    });
}

This works fine and dandy if the form is still visible, for instance if I use pagination it performs as I would expect.

My issue is when the user clicks the browsers back button (the form has now been removed) and then they click the browsers forward button. The event gets triggered but my serialized form data is now empty. Is there any way to cache the form data so I can continue to 开发者_开发知识库call it?

Any thoughts?

Your best bet (I think) would be to store the serialized data in a cookie. When the user returns to the page which he/she has already filled out, retrieve the data from the cookie, unserialize it, and place it back where it belongs.

Cookies are fairly trivial to work with, there is a decent cross-browser implementation for reading/writing cookies on quirksmode:

• http://www.quirksmode.org/js/cookies.html

or if you'd prefer to use a plugin:

• http://code.google.com/p/cookies/
• http://plugins.jquery.com/project/Cookie

You can save data fairly easily using localStorage like http://jsfiddle.net/zDPjm/

Well, sure, you could do something very simple such as:

if ($("#profile_form_id").serialize() != "") serializedFormData = $("#profile_form_id").serialize();
$.post("visits_results.php", serializedFormData, /* Rest of Code */