Problem with modifying a page with ajax, and the browser keeping the unmodified page in cache

Question

I have a situation where my page loads some information from a database, which is then modified through AJAX.

I click a link to another page, then use the 'back' button to return to the original page.

The changes to the page through AJAX I made before don't appear, because the browser has the unchanged page stored in the cache.

Is there a way of fixing this without setting the page not to cache at all?

Thanks :)

Answer 1

Imagine that each request to the server for information, including the initial page load and each ajax request, are distinct entities. Each one may or may not be cached anywhere between the server and the browser.

You are modifying the initial page that was served to you (and cached by the browser, in most cases) with arbitrary requests to the server and dynamic DOM manipulation. The browser has to capacity to track these changed.

You will have to maintain state, maybe using a cookie, in order to reconstruct the page. In fact, it seems to me that a dynamically generated document that you may wish to move to and from should definitely have a workflow defined that persists and retrieves it's state.

Perhaps set a cookie for each manipulated element with the key that was sent to the server to get the data?