ColdFusion 8, DIV, "Loading" graphic issue

This post is more than 2 years old.

Here is something interesting I just ran into. One of my open bugs at work involve adding a "Loading" graphic to an ajax container. The code in question uses CFDIV and hits up a CFC to load the data.

I thought about it this for a second and thought to myself, "Self - doesn't CF8 automatically do loading graphics?"

I whipped up a quick test to confirm this:

<cfdiv bind="url:test3.cfm" />

and test3.cfm just did:

<cfset sleep(5000)> test 3

When I ran this I plainly saw a loading message and graphic. So why wasn't it working in our product? I noticed that the code used cfc:, not url:, so I quickly modified my test:

cfc:<br> <cfdiv bind="cfc:test.getslow()" />

<p> url:<br> <cfdiv bind="url:test3.cfm" />

The CFC method getslow did the same thing test3.cfm did. When I ran this I saw:

As you can see, the CFC based one has no form of loading message while the URL one does. I could switch to a URL based CFC call, but this is rather odd. I can't see why one form of remote call would get a message and another would not.

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

Archived Comments

Comment 1 by Michael White posted on 6/11/2008 at 12:45 AM

was your output on the cfc set to no?

Comment 2 by Raymond Camden posted on 6/11/2008 at 12:47 AM

Yep. To be clear, the output from the CFC did show up. I just didn't have the nice loading msg while it waited.

Comment 3 by Todd Rafferty posted on 6/11/2008 at 2:32 AM

If I had to guess. bind="cfc:" is probably using ajaxproxy and is going straight to the cfc, where-as the bind="url:" is probably using a javascript http call and is actually waiting for a response?

Comment 4 by Raymond Camden posted on 6/11/2008 at 5:09 AM

Well, even when using ajaxproxy, it is still HTTP calls. It has to be. ;)

Comment 5 by Hammo posted on 11/6/2008 at 7:04 PM

Did you ever learn more about this Ray? I like the loading graphic and would like it to appear when I bind to a CFC.

Comment 6 by Raymond Camden posted on 11/6/2008 at 7:22 PM

Nope, sorry. We ended up switching to jQuery anyway. :)

Comment 7 by Brian O. posted on 12/24/2008 at 2:56 AM

I've struggled with the loading icon bug related to cfgrid for awhile and have submitted a bug to Adobe as well as posted on the Adobe Forums without any success and little response. Not sure if this might help your thoughts, but in trying to get the icon to work on the cfgrid I used the sample that Adobe provides with CF and have stripped it down here, but the issue seems to be with the CSS. The div-based example below works, but when I try to get it to work with a cfgrid, no go.


<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<title>Paging Grid Example</title>

<link rel="stylesheet" type="text/css" href="file:///C|/ColdFusion8/wwwroot/CFIDE/scripts/ajax/ext/resources/css/ext-all.css" />
<script type="text/javascript" src="file:///C|/ColdFusion8/wwwroot/CFIDE/scripts/ajax/ext/adapter/ext/ext-base.js"></script>
<script type="text/javascript" src="file:///C|/ColdFusion8/wwwroot/CFIDE/scripts/ajax/ext/ext-all.js"></script>
<script type="text/javascript" src="file:///C|/ColdFusion8/wwwroot/CFIDE/scripts/ajax/ext/examples/grid/paging.js"></script>
<div id="topic-grid" style="border:1px solid #99bbe8;overflow: hidden; width: 665px; height: 300px;position:relative;left:0;top:0;"></div>

Comment 8 by abhijit posted on 9/15/2009 at 9:43 AM


Just I want ot know like in what using js we generally load the dynamic content on ajax call in side a div id.Basically we pass div ids and urls in the javascript function and then load the contents.

Is there any way we can do it through cf8 ajax features,so afr as i have seen is cf8 only gives the ajax control.