James Brown (yes, him) asks:
Yep, and it's so easy, it's rather trivial. As long as you can make a HTTP request with Ajax, then you can run any code you would imagine. I've been blogging about jQuery pretty extensively lately so let's do this one just using what ships in ColdFusion 8. First, I'll create a simple form:Is there a way to assign a value to a client variable using JavaScript? I know JavaScript runs on the client side and ColdFusion on the server, but with AJAX allowing remote calls to ColdFusion I wonder if it might be possible. Thank you for your help.
1 <form>
2 Set Name: <input type="text" name="name" /> <input type="button" value="Set" id="btn" />
3 </form>
Next I'll use the cfajaxproxy to bind to the name form field.
2 Set Name: <input type="text" name="name" /> <input type="button" value="Set" id="btn" />
3 </form>
1 <cfajaxproxy bind="url:setname.cfm?name={name}">
This simply says: Generate JavaScript that watches for a change to the name value and pass it to the url: setname.cfm?name={name}, where {name} will be the value of the form field. The tag also allows you to run CFC methods or JavaScript functions. setname.cfm is simply:
1 <cfparam name="url.name" default="">
2 <cfset client.name = url.name>
And that's it. You may want to change when the Ajax call is made. By default it is fired with the onBlur event. So if you click the set button, or anything else on the page, the Ajax call is made. You could modify things a bit and tell it to fire just on the button click:
2 <cfset client.name = url.name>
1 <cfajaxproxy bind="url:setname.cfm?name={name@none}&{btn@click}">
This bind expression means: Pass name, but don't monitor it (none), and monitor the btn button's click event. Why is there a & between the two binds? I needed a valid URL for the request and the bind has to actually be in the URL itself. Not quite as obvious and simple as the first example, but it gives you a bit more control by running just when the button is clicked.
Comment 1 written by James Brown on 12 February 2009, at 9:50 PM
Comment 2 written by Glyn Jackson on 13 February 2009, at 4:16 AM
<cfajaxproxy cfc="components.something" jsclassname="callsomething"/>
this has been my life saver over the last few weeks, I love ColdFusion!
Comment 3 written by Eric Belair on 13 February 2009, at 8:19 AM
Comment 4 written by Raymond Camden on 13 February 2009, at 8:21 AM
Comment 5 written by Glyn Jackson on 13 February 2009, at 8:48 AM
In the case of a shopping cart, I have used a CFC as a Javascript object, but nothing gets written to the cart directly using the object, everything is checked against the a database so price and description have to match also its cleaned from injection etc... but the same goes for anything like cfhttp calls etc.
Comment 6 written by Eric Belair on 13 February 2009, at 8:51 AM
Thanks.
Comment 7 written by BrianO on 13 February 2009, at 3:45 PM
Comment 8 written by Sam on 2 April 2009, at 10:07 AM
When i try the script above and click the 'set' button, I get a big popup error saying 'Error parsing JSON response:' followed by the HTML of the page.
Any idea where I'm going wrong?
Comment 9 written by Raymond Camden on 2 April 2009, at 10:09 AM
Comment 10 written by Sam on 2 April 2009, at 10:26 AM
I will start a topic in the forum about this, so I don't pollute the comments area here.
I'm having trouble working this out.
Comment 11 written by Dishika on 8 October 2009, at 7:35 AM
File temp.cfm
function test1()
{
alert("hello");
}
<form>
set name : <input type="text" name="name" /><input type="button" id="btn" />
</form>
<cfajaxproxy bind="url:test.cfm?name={name@none}&{btn@click}" onSuccess = "test1();">
File test.cfm
<cfset session.temp = "url.name">
But it not working as the variable session is being set url.name and not the value from the input.
Please help as it is very important
Comment 12 written by Raymond Camden on 8 October 2009, at 7:52 AM
[Add Comment] [Subscribe to Comments]