I was just talking to John Ramon about an odd issue he was having with Internet Explorer and Ajax. His code was incredibly simple and worked fine in Chrome but not IE. Here's a quick example of how simple his code was:


<head> <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script> <script> $(document).ready(function() { $("#spot").load("test3.cfm"); }) </script> </head>


<div id="spot"></div>

</body> </html>

As you can see, all this code does is load the page and make an Ajax request to load test3.cfm. When I tested his site in IE9 it worked fine. I then found a machine with IE8 (yeah, cuz lord forbid a web developer be allowed to run IE8 and 9 on the same machine without creating an entire operating system virtual image as opposed to just freaking running two apps but I'll stop the sermon now) and it also worked for me fine there!

Turns out the issue was ColdFusion debugging! That's why it worked fine in my IE and not his. He had his debugging restricted to just his IP so I never saw it. Now here's where things get interesting. Those of us who use Ajax and ColdFusion are used to disabling debugging since it breaks JSON responses. But in this case it should not have mattered. ColdFusion's debugging HTML would have just been added to the end. And in fact, when I turned on debugging and ran the page in Chrome, I just saw 2 copies of the debugging info. One from the "main" page I ran and one from the page loaded via Ajax. But in IE (and that includes IE9) I was able to replicate it as well.

My guess is that the closing </div> tag output in the beginning of ColdFusion's debugging output broke IE's DOM when it was inserted into the div. This is - probably - IE being a bit more strict than Chrome.

As one last reminder - you can easily use ColdFusion debugging and turn it off on a per request basis using:

<cfsetting showdebugoutput="false">