Solution to Ajax Includes Script Caching Error in Firefox 3? [Archive]

View Full Version : Solution to Ajax Includes Script Caching Error in Firefox 3?

bdkyle

01-15-2009, 11:02 AM

Ajax Includes Script
http://www.dynamicdrive.com/dynamicindex17/ajaxincludes.htm

I have been using the fantastic Dynamic Drive AJAX includes script (http://www.dynamicdrive.com/dynamicindex17/ajaxincludes.htm) for left-hand column navigation for years now, and it's a great script. Thank you for all the hard work creating it.

Unfortunately, with Firefox 3 it sometimes "throws" the content displayed by the script from the left-hand column into the middle or end of the main content (rather than inserting it where coded). Refreshing the page or even just clicking back and then forward again makes the script display properly. This post (http://www.dynamicdrive.com/forums/showthread.php?t=35154) from the DD Forums describes a similar problem with the same script but no one really posted an acceptable solution.

From Googling, I also found this blog post (http://www.west-wind.com/Weblog/posts/469125.aspx) which explains this type of behavior likely is caused by a bug in Firefox 3 related to caching static content. It appears that Firefox 3 has a number of related bugs (https://bugzilla.mozilla.org/buglist.cgi?quicksearch=Cache-control).

Has anyone discovered an acceptable solution to this problem? Thank you.

jscheuer1

01-15-2009, 02:48 PM

I'd want to see a demo of the problem. Where do I have to go, and what do I have to do to make it happen? Is it repeatable, or does it only happen sometimes?

Anyways, if the problem is caching of the imported content, use this code:

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title></title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<script type="text/javascript">
function loadXmlHttp(url, id, bust) {
var f = this;
f.xmlHttp = null;
/*@cc_on @*/ // used here and below, limits try/catch to those IE browsers that both benefit from and support it
/*@if(@_jscript_version >= 5) // prevents errors in old browsers that barf on try/catch & problems in IE if Active X disabled
try {f.ie = window.ActiveXObject}catch(e){f.ie = false;}
@end @*/
if (window.XMLHttpRequest&&!f.ie||/^http/.test(window.location.href))
f.xmlHttp = new XMLHttpRequest(); // Firefox, Opera 8.0+, Safari, others, IE 7+ when live - this is the standard method
else if (/(object)|(function)/.test(typeof createRequest))
f.xmlHttp = createRequest(); // ICEBrowser, perhaps others
else {
f.xmlHttp = null;
// Internet Explorer 5 to 6, includes IE 7+ when local //
/*@cc_on @*/
/*@if(@_jscript_version >= 5)
try{f.xmlHttp=new ActiveXObject("Msxml2.XMLHTTP");}
catch (e){try{f.xmlHttp=new ActiveXObject("Microsoft.XMLHTTP");}catch(e){f.xmlHttp=null;}}
@end @*/
}
if(f.xmlHttp != null){
f.el = document.getElementById(id);
if(bust)
bust = (loadXmlHttp.re.test(url)? '&' : '?') + 'loadxmlhttpbust=' + new Date().getTime();
f.xmlHttp.open("GET",url + (bust || ''),true);
f.xmlHttp.onreadystatechange = function(){f.stateChanged();};
f.xmlHttp.send(null);
}
else alert('Your browser does not support AJAX!'); // substitute your desired request object unsupported code here
}

loadXmlHttp.re = new RegExp('\\?');

loadXmlHttp.prototype.stateChanged=function () {
if (this.xmlHttp.readyState == 4 && (this.xmlHttp.status == 200 || !/^http/.test(window.location.href)))
this.el.innerHTML = this.xmlHttp.responseText;
}
</script>
</head>
<body>
<div id="test">

</div>
<script type="text/javascript">
new loadXmlHttp('external.htm', 'test', true);
</script>
</body>
</html>

bdkyle

01-23-2009, 08:12 AM

Thank you for the code, John, it is much appreciated.

The problem is inconsistent and I haven't noticed any particular pattern, which makes it a pain to troubleshoot, but you may go to the site (http://www.everymac.com/) and browse around using Firefox 3 if you have the time.

Eventually one of the left hand side navigation elements that loads via the Ajax includes script (http://www.dynamicdrive.com/dynamicindex17/ajaxincludes.htm) will be thrown into the main column. If you see two horizontal rules without text in between them, that is the indicator that something is amiss and you can then look toward the middle or bottom of the main column to find the links that should have been displayed in the left hand column.

This post (http://www.dynamicdrive.com/forums/showthread.php?t=35154) indicates that other users are having the same issue with the same script in FF 3.

My code is far from flawless, and it is heavily hacked to work with IE 5/6 for Windows and IE 5 for the Mac -- to support legacy MacOS 9 users -- but it has worked perfectly for years and has only suddenly become a problem with FF 3.

If you spot something that I have overlooked, please let me know. Thanks again!

jscheuer1

01-23-2009, 09:47 AM

Well I couldn't get it to misbehave. I did surf on over to your host's (MacHost) page. The offer PHP. A PHP include would be better than any AJAX include and shouldn't have this problem.

bdkyle

01-23-2009, 10:24 AM

It doesn't misbehave consistently, you might have to view 20 pages or more. I'd rather not go the PHP route, but thanks for the suggestion.

jscheuer1

01-23-2009, 10:28 AM

Then try out the code I wrote. It works pretty much the same, you just need a container as shown. You may use it as many times as you like on a page, each with its own unique container.

bdkyle

01-23-2009, 10:38 AM

Okay -- will investigate both routes. Thanks again!