Ask a Grokker: Can I change CF Client Variables with JavaScript?
February 13 2009 by
Adam
Yesterday, Ray posted Ask a Jedi: Using ColdFusion Ajax to set Client Variables. Now, far be it from me to steal from Ray — but what it looks like is that the question asker also posted his question to Stack Overflow; and after composing my response there I decided it would make a good blog entry too.
As it turns out, Ray's response is really clever. I'm quite fond of it, actually. But I still think mine is a bit more robust and closer to what you might call the "right" way to do it.
The question, to save you the clicking if you haven't seen either of those two pages, was how to get and set ColdFusion client variable values with JavaScript. As for dependencies, my solution uses jQuery and the returnFormat parameter added in ColdFusion 8.
What you want to do is write what would be called a Client Facade
ClientFacade.cfc:
And to use this component, you need to write some client-side JavaScript. As I said before, I used jQuery — because I never leave home without it.
test.cfm:
foo:
Note that I'm using "xscript" instead of "script" tags so that Mango will allow me to post it.
This code remotely (via AJAX) accesses ClientFacade.cfc to send data back and forth. It lets you specify a default value when getting, instead of dealing with non existence.
We start with a few simple form fields: a textbox, a button to save the value, and a button to get and alert the value. To demonstrate that it really is working over AJAX and not just reloading the page faster than can be perceived, you could simply CFDump the Client scope on the page. This would show that the values in server memory are changing without the page reloading.
Then, some click event handlers are binded to our buttons that use jQuery's getJSON method to interact with the server, and the return data is managed with anonymous callback functions.
One final note: Notice that in the SET operation, I'm quoting the variable name:"val":valuThis is because "val" is a JavaScript reserved word. I should have thought of that when writing my CFC, but I didn't, and this is how you get around the issue. (Or just rename the CFArgument, but who has time for that?)
Posted in ColdFusion | JavaScript |
3 comments



Nice! Notice, you have a typo (escaped html) around the first paragraph.
Since this is a generic setter/getter, you'd also want to add some logic in the santize section to check for valid client variable names, otherwise you'd leave the door open to someone crashing your website by arbitrarily setting random client variables.
Yes, it's a corner case but something that someone should keep in mind if they take this approach.
@Ray, thanks for pointing out the typo. Fixed it. :)
@Dan, yes, some pretty significant sanitization would be required. In general, you wouldn't let the user affect variable name (just its value), but as the methods are remotely available you still want to account for it in case an enterprising hacker tries to hijack the request. I did leave a comment for that, but as it wasn't part of the concept I didn't want to waste time or space on it.