Simple auto-reload ColdFusion 8 Ajax Demo

A user on my forums asked about creating a region on his web page that would auto reload, like what he saw on att.com. I used to have an auto-reloading item on coldfusionbloggers.org, and I thought I had blogged on it, but wasn’t able to find it. Forgive the dupe if you remember an earlier entry about this. Anyway, here is a real simple example. First, I’m to start with a page that uses cfdiv to load the content I want to reload.

<html>

<head> </head>

<body> <h2>Where is Oktoberfest?</h2>

<p> Foo </p>

<cfdiv id=”ad” bind=”url:ad.cfm” />

</body> </html> </code>

The file I’m using, ad.cfm, will rotate between 4 ads, or pieces of content, or whatever. In my case it is a simple counter:

<cfparam name="session.counter" default="0"> <cfset maxAds = 4> <cfset session.counter++> <cfif session.counter gt maxAds> <cfset session.counter = 1> </cfif>

<cfoutput> <p> <b>This is ad #session.counter#</b> </p> </cfoutput> </code>

So to start reloading the content, I’m going to set up a interval. I’ll launch this using ajaxOnLoad:

<cfset ajaxOnLoad('setup')>

and here is setup:

function setup() { setInterval(reload,5000); }

This says, run the reload function ever 5 seconds. The reload function is pretty trivial:

function reload() { ColdFusion.navigate('ad.cfm','ad'); }

So all in all a very simple piece of code. I’ve included the entire template below.

<html>

<head> <script> function reload() { ColdFusion.navigate(‘ad.cfm’,’ad’); }

function setup() { setInterval(reload,5000); } </script> </head>

<body> <h2>Where is Oktoberfest?</h2>

<p> Foo </p>

<cfdiv id=”ad” bind=”url:ad.cfm” />

</body> </html> <cfset ajaxOnLoad(‘setup’)> </code>

Raymond Camden's Picture

About Raymond Camden

Raymond is a developer advocate. He focuses on JavaScript, serverless 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

Comments