Web Trenches

I first started doing Ajax programming using the Prototype framework.  As I learn the new CF8 Ajax features, I find myself looking for simple ways to replicate some of the functionality that is in prototype.  With prototype, you use $F('element') to return the value of a form field.  There is a similar method for CF8, but it needs a little tweak... 

The function that returns the value of a form element in ColdFusion 8's Ajax implementation is the following:

 ColdFusion.getElementValue(id);

It's really handy because it will return a form field value for any type of form field - even select boxes and radio button. 

However, that's a lot of typing if you are using many form values in your JavaScript/Ajax code.  There is a super easy way to reduce this.  Make your own shorter function that just calls this.

 For example,

function $CF(element) {
        return ColdFusion.getElementValue(element);
        }

 Here is an oversimplified example:

 <cfajaximport />
<cfform action="" method="post">
<cfinput type="text" name="testelement" VALUE="test" />
</cfform>
<script>
    function $CF(element) {
        return ColdFusion.getElementValue(element);
        }
    window.alert($CF('testelement'));    
</script>

You could put the $CF function in a JS file that is used throughout your application.  But remember, you can only use ColdFusion.getElementValue() on pages that invoke the Ajax libraries.  In the example above, that's why I placed a <cfajaximport /> tag in there.  This example doesn't use Ajax, and including the libraries is really a waste of resources in this circumstance.  Save this trick for your true Ajax apps.  

More about ColdFusion.getElemenValue() from Adobe