back and forward buttons to control ajax loads

Question

hallo together,

i am searching for a solution, where the back and forward buttons control my ajax-call history.

so if i maka a ajax call, and then press "back" i want to reload the original page.

if i do a ajax call and then another, and then press the back button i want to do the first ajax call again.

and so on ... (i.e. if i now would press the forward button, the second ajax coll shell be redone ;-) )

thanks

UPDATE

well, i resolved the whole thing with a very nice jquery plug in named jQuery Address and it works quite well.

the thing is, that i have problems to get beck on the original site. i navigate to mysite.foo/step1 then i trigger an ajax call and i land on maysite.foo/step1#/#step2, when i now press the back button i stay on that site with its content (of step2), and i can't get information about my original landing page, to reload that ...

amendendly: i have an array where i store the ajax-calls which are indexed by i.e. step2.

step1 : {id: 1, url: /ste1.php, ... },
step2 : {id: 2, url: /step2.php, ... },...

and a function, which also sets the hash, calls the ajax request.

Answer 1

You should save your ajax "state" in the document location hash (i.e. http://page-url#ajax-state ).

If you modify just the hash component, the browser won't do a page reload, but the browser history will record a change of URL. Therefore, when you press back, you'll be able to re-play the ajax call based on the information stored in the document hash.

See also this question: http://stackoverflow.com/questions/172957/detecting-back-button-hash-change-in-url