Here's some free advice: don't forget the cache-control tags on any server-side AJAX page. I was doing some Geodesic Solutions customization today. Anyone who has dealt with Geo will tell you it's the biggest pain to customize, and that anyone who mentions Geo and best-practices in the same breath must be joking. Basically, the only way to customize it is through a series of patches, or by reworking the Geo class files (which will be overwritten in any upgrade). Geo doesn't allow any mysql calls within the templates (I suppose it's a good security measure), and since I didn't need to do too much database work, I decided to do all the database stuff with AJAX. So far so good. Basically, I was trying to populate a select box with a bunch of options, and I found out that IE can't handle adding options thru innerHTML. So I reworked it, put the id I used for the innerHTML on a container div rather than the select tag, and passed the select tag thru the AJAX. No change. I ended up completely reworking the AJAX/Javascript on the page, so that the AJAX spit out a comma delimited string, which I then passed back to the page, where I split it into an array, and passed it thru a loop: document.getElementById('selectId').options[i] = new Option('optionText','optionValue');
Well I was pretty happy with this solution, since it seemed more optimized than using innerHTML (I'm trying to get away from innerHTML as much as possible), but lo and behold, no change on the IE page. Well at this point I was suspicious, so I started alerting tons of crap from my Javascript functions. It turned out the string that was passed back from the AJAX page still had tags in it, and I realized, to my idiotic relief, that I had forgot to include the
header("Cache-Control: no-cache, must-revalidate")
header("Expires: Mon, 26 Jul 1997 05:00:00 GMT")
So IE was using the server-side cache, while Firefox was not. Weird. Must be because IE handles it more like an object and FF handles it like a page (just a guess).
Moral of the story: include the Cache-Control stuff or else
Jon Raasch is a UX nerd and free-lance web designer / developer who loves jQuery, Javascript & CSS.
John,
I tried that method but for some reason, it still wouldnt work. Some strange versions on IE would still hold onto the cache. Here’s an exerpt from my post (http://www.designmills.com/2008/03/21/ajax-and-ie-7-cache-not-invalidating/):
response.setDateHeader( “Expires”, -1 );
response.setHeader( “Cache-Control”, “private” );
response.setHeader( “Last-Modified”, new Date().toString() );
response.setHeader( “Pragma”, “no-cache” );
response.setHeader( “Cache-Control”, “no-store, no-cache, must-revalidate” );