Interesting Internet Explorer/Ajax/ColdFusion issue

This post is more than 2 years old.

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:

<html>

<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>

<body>

<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">

Raymond Camden's Picture

About Raymond Camden

Raymond is a senior developer evangelist for Adobe. He focuses on document services, JavaScript, and enterprise cat demos. If you like this article, please consider visiting my Amazon Wishlist or donating via PayPal to show your support. You can even buy me a coffee!

Lafayette, LA https://www.raymondcamden.com

Archived Comments

Comment 1 by todd sharp posted on 4/13/2011 at 10:59 PM

Don't forget you can also append _cf_nodebug=true to your individual Ajax URLs to disable it on a request basis. I use that often by setting a baseURL in JS (foo.cfm?_cf_nodebug=true) that I use in all my Ajax requests - that way I can open the URL in another tab to view the response directly and also have access to the debug output in another browser tab.

Comment 2 by Raymond Camden posted on 4/13/2011 at 11:01 PM

The issue is that I _never_ remember that.

Comment 3 by todd sharp posted on 4/13/2011 at 11:13 PM

The funny thing is that every time I use it I have to google for the exact syntax because I always forget exactly what it is.

Comment 4 by Edward - Florida SEO posted on 4/13/2011 at 11:13 PM

Good looking out Todd ...

That's a subtle one to remember ... ;-)

Comment 5 by Steve W posted on 4/13/2011 at 11:16 PM

What happens when you use the IE emulation functionality of IE9 (http://msdn.microsoft.com/e... Just curious.

Comment 6 by Raymond Camden posted on 4/13/2011 at 11:18 PM

SteveW: Didn't seem to help.

Comment 7 by David Hammond posted on 4/13/2011 at 11:29 PM

Note that you can use IETester to test in old versions of IE pretty well: http://www.my-debugbar.com/...

As Steve points out, IE9 has modes to IE8 and IE7 too, but I'm not sure if that would catch everything.

Comment 8 by Phillip Senn posted on 4/14/2011 at 12:49 AM

Thanks Raymond!

Now there are three statements that I'll be adding to the top of all my remote components:

<cfsetting showdebugoutput="false">
<cfcontent type="application/json">
<cfparam name="url.returnformat" default="json">

Comment 9 by William from Lagos posted on 4/14/2011 at 3:19 AM

Run multiple versions of IE at once without the need for a virtual machine www.my-debugbar.com/wiki/IE...

Comment 10 by Mihai Baboi posted on 4/14/2011 at 11:46 AM

I have DebugBar installed and it's not very useful. It crashes all the time and doesn't always render as IE would. It's a good tool, but it would still be nice to be able to run multiple versions of IE at the same time.

Comment 11 by Jeremy Battle posted on 4/15/2011 at 3:59 AM

Not sure if this is helpful to anyone, but if you get the IE10 Platform Preview, and choose the debug option from the menu, you can change the document modes and browser modes (IE7-10) easily in the debug -> developer tools. Lessens the need for having IE8 on a VM or 2nd machine

Comment 12 by John posted on 10/27/2011 at 3:46 PM

I believe you spelled "sermon" wrong.

Comment 13 by Raymond Camden posted on 10/27/2011 at 4:57 PM

Fixed, thanks.