Geek Answers Handbook

Updated Ajax user interfaces and back button

Scenario:

  • The page is loaded with a complex user interface on it.
  • The user performs some actions that modify data through Ajax callbacks, changes are reflected in the user interface using DOM manipulation (for example, through jQuery).
  • The user clicks on the link to go to another page (for example, on the details page).
  • The user clicks the back button to return to the original user interface page.
  • The user sees outdated information - it seems that the changes that he made (in step 2) never happened.

How do you deal with this situation?

+6
jquery user-interface ajax
source share
4 answers

Cookies The only way to save information after a user leaves the page and returns using cookies.

The best way to do this is

0. user goes to your page 1. A page is loaded with complex UI based on what is saved in the users cookies (default if no cookie) 2. user does some actions, which are saved into the cookie 3. user goes to another page
+2
source share

You can make the page refresh when you click the back button, which then pulls the updated data from the server.

 <META http-equiv="Cache-Control" content="no-cache"> <META http-equiv="Pragma" content="no-cache"> <META http-equiv="Expires" content="-1">

You can also take a look at the Real Simple Story and see if you can use their methods to use the back button.

+2
source share

No matter what data will be transferred to the next page, you must also return it back to change the user interface as it should be.

This can be done using cookies, or it can be done using the outgoing mail / server logic. Just pass the values ​​to the second page, and when the user wants to return, just be sure to pass them back and change the interface depending on the values. You can even use the session for this, you would like to, but I think it might be redundant if this is the only place you need it.

Metropolis

+1
source share

Cookies are not the only way. Think about the jQuery BBQ plugin. See http://mattfrear.com/2010/03/20/enabling-browser-back-button-on-cascading-dropdowns-with-jquery-bbq-plugin/

It basically uses # variables added to the query string to trick the browser into considering it to be a new page, so if you need to refresh or return to the page, #variable will re-populate the controls.

0
source share

More articles:


All Articles