Within my app a user eventually navigates to an external link by going through a few dynamically populated listviews (Each listview click ajax loads content into the next listview) All the pages are contained within the same HTML file.
However, after visiting the external link, if the user then clicks back, all the previous listviews are now empty (so they have to click back 2-3 times to reach the home page)
Is there a way of caching this so back functions as a user would expect?
I've tried setting dom caching on the page divs, and tried opening the external link in a browser but to no avail.
(We crossed posts while I was editing, so I've moved my comment)
When you visit an external link (I assume you are using data-rel="external")
the document is reloaded from the external link. Your cached pages are
discarded, along with everything else in the document. When you return
to your site, everything is reloaded as if the user were first entering
There is no way to avoid this.
You will need to adopt some other strategy. For example, open the external link in a separate window or tab (use target
in your link). Or, you could store the details you need in order to
re-build the page in HTML5 local storage (or even a cookie). (I advise
using one of the many local storage libraries that hides the details of
local storage from you and works across a wide variety of browsers.)