How does this ajax call persist DOM changes in the browser cache?
- by Greg
For the purpose of the question I need to create a simple fictitious scenario.
I have the following trivial page with one link, call it page A:
<a class="red-anchor" onclick="change_color(event);" href="http://mysite.com/b/">B</a>
With the associated Javascript function:
function change_color(e)
{
var event = e || window.event;
var link = event.target;
link.className = "green-anchor";
}
And I have the appropriate CSS to make the anchor red or green based on the classname.
This is working. That is, when I click the anchor it changes color from red to green, which is briefly visible before the browser loads page B.
But if I then use the BACK button to return to page A I get different behavior in different browsers.
In Safari, the anchor is still green (desired behavior)
In Firefox it reverts to red
I imagine that Safari is somehow updating its cached version of the page, whereas Firefox isn't.
So my first question is: is there any way to get FF to update the cached page, or is something else happening here?
Secondly: I have a different implementation where I use an ajax call. In this I set the class of the anchor using a session variable, something like...
<a class="<?php echo $_SESSION["color"]; ?>" ...[snip]... >B</a>
And the javascript function makes an additional ajax call that changes the "color" session variable.
In this case both Safari and Firefox work as expected. When going back from B to A the color is still green. But I can't for the life of me figure out why it should be different to the non-ajax case. I have tried many different permutations and for it to work on FF the "color" session variable MUST change (i.e. the ajax call itself is not somehow reloading the cache). But on coming BACK, the page is being reloaded from the cache (verified in Firebug), so how is the page even accessing this session variable if it isn't reprocessing the page and running that fragment of php in the anchor?
I figure there must be something fundamental here that I am not understanding. Any insight would be much appreciated.
