Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

How to keep the browser history in sync when using Ajax?

I'm writing a simple photo album app using ASP.NET Ajax.
The app uses async Ajax calls to pre-load the next photo in the album, without changing the URL in the browser.

The problem is that when the user clicks the back button in the browser, the app doesn't go back to the previous photo, instead, it navigates to the home page of the application.

Is there a way to trick the browser into adding each Ajax call to the browsing history?

like image 999
urini Avatar asked Aug 27 '08 10:08

urini


People also ask

What is AJAX synchronous call?

AJAX: Synchronous or Asynchronous Synchronously, in which the script stops and waits for the server to send back a reply before continuing. Asynchronously, in which the script allows the page to continue to be processed and handles the reply if and when it arrives.

Does AJAX work on all browsers?

Ajax is supported in all modern browsers. We suggest using the following browsers: Google Chrome. Mozilla Firefox.


1 Answers

Update: There is now the HTML5 History API (pushState, popState) which deprecates the HTML4 hashchange functionality. History.js provides cross-browser compatibility and an optional hashchange fallback for HTML4 browsers.

The answer for this question will be more or less the same as my answers for these questions:

  • How to show Ajax requests in URL?
  • How does Gmail handle back/forward in rich JavaScript?

In summary, you'll definitely want to check out these two projects which explain the whole hashchange process and adding ajax to the mix:

  • jQuery History (using hashes to manage your pages state and bind to changes to update your page).

  • jQuery Ajaxy (ajax extension for jQuery History, to allow for complete ajax websites while being completely unobtrusive and gracefully degradable).

like image 190
balupton Avatar answered Sep 19 '22 11:09

balupton