Bound CFDIV content caching

Recently I had a CFDIV that was bound to a SELECT box with the intent of showing more details about the selected item. The CFDIV was bound to a CFC method which looked up results from the database and returned the results as an unordered list. But as I was working with this, I ran into instances where the data was not changing as expected. I quickly realized I had a caching issue.

I had heard about a similar issue with CFSELECT, and that a solution seemed to be to use

ColdFusion.bindHandlerCache[objectName].call();
but that didn't seem to have an effect on the CFDIV.

I believe that the real problem is in Firefox 7.0.1 and it's internal caching. In fact, I did notice that with the Web Developer Toolbar, if I told it to "disable cache" that I got the expected results. Which is good for me, but I cannot expect the end-users to disable their browser cache, and they shouldn't have to do so. So I came up with a simple method of attaching a timestamp for each call.

First I created a function to capture a change event on the SELECT box, when called it sets the event's timestamp to a form object. See the JavaScript below:

function setTimeStamp(strObj, event) {
if(event.timeStamp) {
var ts = event.timeStamp;
} else {
var ts = new Date().getTime();
}

if(document.getElementById(strObj)) {
document.getElementById(strObj).value = ts;
} else if(document.getElementsByName(strObj)) {
document.getElementsByName(strObj).value = ts;
}
}

Next, I added that function to the onChange event of my SELECT box, then I added a hidden field and populated it with the current timestamp.

<select id="category" onChange="setTimeStamp('my_timestamp', event)">
....
</select>

<input type="hidden" id="my_timestamp" value="#dateFormat(now(),'yyyymmdd')#.#timeformat(now(),'HHmmss')#" />

To finish it up, I altered my CFC method to expect a time stamp parameter, and I altered my CFDIV bind so that it was now bound on the SELECT box and the hidden timestamp.

<cfdiv id="mySubCategories" bind="cfc:lib.categoryMgr.getSubCategories({category},{my_timestamp})" bindOnLoad="true">

So now every time my select box value changes, the field my_timestamp gets updated to the millisecond, and the built in AJAX methods fire the request, and Firefox does not cache the result.

Comments (Comment Moderation is enabled. Your comment will not appear until approved.)
Comments are not allowed for this entry.
BlogCFC was created by Raymond Camden. This blog is running version 5.8.001.