How can I force the back button to remember an AJAX/Javascript state (preferably using JQuery)?
March 21, 2011 7:05 AM Subscribe
How can I force the back button to remember an AJAX/Javascript state (preferably using JQuery)?
I'm making a quiz website. You get a question, click an answer, and then get an AJAX'd/JQuery'd bit which shows the correct answer and explanation, hides the submit button, and then you click to move forward to a new page and next question.
When the user clicks the back button, however, I don't want them to be able to do the question over again if they've already answered it: I want the answer and explanation to be displayed with the submit button gone.
I've looked into the BBQ plugin and Hashjax, but they look like they work only for inline content back buttoning. I've also tried putting PHP and Javascript into the header to force these things, but I think the browser's just loading the page from the cache, not re-processing it. Suggestions? Thanks!
I'm making a quiz website. You get a question, click an answer, and then get an AJAX'd/JQuery'd bit which shows the correct answer and explanation, hides the submit button, and then you click to move forward to a new page and next question.
When the user clicks the back button, however, I don't want them to be able to do the question over again if they've already answered it: I want the answer and explanation to be displayed with the submit button gone.
I've looked into the BBQ plugin and Hashjax, but they look like they work only for inline content back buttoning. I've also tried putting PHP and Javascript into the header to force these things, but I think the browser's just loading the page from the cache, not re-processing it. Suggestions? Thanks!
http://developer.mozilla.org/en/DOM/Manipulating_the_browser_history
posted by thefool at 10:57 AM on March 21, 2011
posted by thefool at 10:57 AM on March 21, 2011
Yes, you want to use session cookies for this. Come up with a way to encode answer state in a text string, and save it in a cookie, then check the cookie when rendering the question page.
Add an document.onload handler so that when the page reloads, you can check to see if this page's question has already been answered and modify the display accordingly. Cookies are accessible in JS via the document.cookie object. There are dozens of guides readily googleable; the code at this link looks typical.
posted by axiom at 11:13 AM on March 21, 2011
Add an document.onload handler so that when the page reloads, you can check to see if this page's question has already been answered and modify the display accordingly. Cookies are accessible in JS via the document.cookie object. There are dozens of guides readily googleable; the code at this link looks typical.
posted by axiom at 11:13 AM on March 21, 2011
This thread is closed to new comments.
http://forum.jquery.com/topic/saving-state-for-a-jquery-table
where a poster suggested using this plugin:
http://plugins.jquery.com/project/Cookie
might be worth a try - save info whenever a user answers a question, and then each time the page loads check if they've answered it already. (Not sure what happens if users don't have cookies enabled)
also check the answers here: http://stackoverflow.com/questions/2907099/ajax-updated-user-interfaces-and-the-back-button
posted by ghostbikes at 10:07 AM on March 21, 2011