I’m having trouble searching for an answer to this, I think because the key words are too general and related to other things.
I have an index page with a records search form (AJAX) used to load records into the main div on the page. When the page first loads, the form is set to a specific state based on who the user and the contents of the div are loaded based on the same criteria. When the form is submitted the contents of the main div are replaced via AJAX.
If a user clicks a browsers REFRESH button, or goes to another page and clicks the browser BACK button, the index page comes up with the form in the same state it was when the user clicked BACK or REFRESH but the div contents are the original default contente. This makes it looks like the items listed are a result of the forms current state.
Is there a way way to detect if the page has been displayed from a a BACK or REFRESH browser action so that I could trigger the form to submit and update the contents based on the current state of the search form ($(‘#search_form_submit_button’).click();)? Or, what is the proper thing to do for this?
Thanks – much appreciated!
If the form has a default value such as “” or “Search here..” you could check if the default value has changed and then submit the form:
And call that on page ready – so inside the
$(function(){ /* content here */ });Also, have a look at History.js – https://github.com/browserstate/History.js
It provides a really complete history management system. It supports jQuery amongst several other libraries.
EDIT:
I will address some things Reno mentioned in his comment.
You can use this small library Session variables to persist data over page changes. Download the js file from that link and include it in the
<head>of your document:Then when a user makes a search, store the search in the
sessvarsobject which is now available across pages:Then when the page loads, check if sessvars.myObj.search has a value in it. If it does then search for that value: