Ask Ben: Converting Javascript Variables Into ColdFusion Variables

Posted June 22, 2009 at 9:51 AM

Tags: ColdFusion, Javascript / DHTML, Ask Ben

How can I convert a JavaScript variable into a coldfusion variable?

I have been asked this question enough times that I figured it was be time to turn it into an actual Ask Ben blog post for future reference. Often times, when front-end developers start getting into server-side scripting (hopefully using ColdFusion), there is some confusion as to where the various parts of the page rendering work flow are executing. And, because of this confusion, developers get stuck trying to access one part of the work flow from another.


 
 
 

 
ColdFusion Executes On The Server - Javascript Executes On The Client (Web Browser).  
 
 
 

To clear up the confusion, I think you just need to step back and understand the request-response processing work flow:

  1. The server gets a request to deliver some content (at the given URL).
  2. The server constructs the response (in our case, an HTML page containing Javascript).
  3. The server returns the HTML data to the client (Web Browser).
  4. The data streams from the Server to the Client.
  5. The browser renders the response (HTML page) for the user at which time any embedded Javascript code executes.

Once we hit step #4, the ColdFusion server is no longer involved. In step #5, when the client renders the HTML response, it doesn't even have to know where the HTML data came from. As such, when the Javascript executes in step #5, it has no knowledge of nor any access to the ColdFusion portion of the page response work flow - these two points of execution happen at different times on different machines.

Javascript can, however, communicate with the ColdFusion server by making AJAX-based page requests. These HTTP requests are viewed by the ColdFusion server as completely new page requests by the client and do not have access to temporary ColdFusion variables created during previous requests (unless those variables were explicitly cached on the server).

So, the moral of the story is that you can't really turn a Javascript variable into a ColdFusion variable because the two are completely unrelated. Once you understand the page request / response work flow, this becomes obvious. If you want Javascript to send values back to the ColdFusion server for further processing, you can only do so via AJAX requests. I hope that this clears up some confusion.

Post Comment  |  Ask Ben  |  Other Searches  |  Print Page




Reader Comments

Jun 22, 2009 at 9:13 PM // reply »
1 Comments

You can always write to a hidden form field if you are processing a form, etc.


Jun 23, 2009 at 12:56 AM // reply »
34 Comments

Great Post

When you are calling your JavaScript you can always have the included JavaScript file end in a .cfm which would help in some cases... This will allow you to load different content based on variables that you pass... you can always pass variables through JavaScript like so...

<script type="text/javascript"
src="javascript.cfm?var1=bob&var2=frank">
</script>

This essential will pass the variables to coldfusion in which you can convert the variables into coldfusion variables using the url variable... I have used this method a few times but I don't recommend it for really robust applications.


Jun 23, 2009 at 1:37 AM // reply »
1 Comments

What about <cfwddx action="cfml2js" ... />?
Sure, we can't use ColdFusion vars on the client side, but we can serialize them and return to the browser along with the rest of the JavaScript code.


Jun 23, 2009 at 4:59 AM // reply »
1 Comments

json format is very helpfull to pass variables between javascript and coldfusion in ajax calls. There are 2 coldfusion functions since cf8 DeserializeJSON() and SerializeJSON().
And from you javascript code you can serialize your JS variables to a json string by using the json serializer( http://www.JSON.org/json2.js ).


Jun 23, 2009 at 6:06 PM // reply »
7,490 Comments

@Jody,

Definitely true - a great technique.

@Alexey,

Yeah - using ColdFusion variables to help render the Javascript that ultimately gets executed by the browser is definitely some we can do, and is the easier of the two directions (server to client vs. client to server).

@Patrick,

JSON rocks! 'nuff said.


Post Comment  |  Ask Ben

Recent Blog Comments
Mar 14, 2010 at 2:01 PM
Creating UI Elements With Low-Coupling And Conditional Event Handling
@Ryan, It's definitely an interesting approach. I'm used to binding to objects / elements that the idea of binding to an event object is a bit much to wrap my head around just yet. As far as the TH ... read »
Mar 14, 2010 at 10:08 AM
The Magic Of Thinking Big By David Schwartz (Thanks Clark Valberg!)
@Kamal, You can get it off of iTunes / Audible.com. ... read »
Mar 13, 2010 at 9:14 PM
The Magic Of Thinking Big By David Schwartz (Thanks Clark Valberg!)
Ben, COuld you plz tell me how to find the audio book version of The Magic of Thinking Big by David J. Schwartz, Ph.D Thanks ... read »
sun
Mar 13, 2010 at 6:21 PM
Sending (SMS) Picture Messages With ColdFusion And CFMail
MY BAD! @tmomail.net IS correct ... but, ONLY from pic taken W/ a cell -- NOT as attachment in an email ... (took ~4 min. for it to arrive ... then would NOT DL to my cell) ... read »
sun
Mar 13, 2010 at 6:16 PM
Sending (SMS) Picture Messages With ColdFusion And CFMail
@tmomail.net is NOT correct! IS t-mobile addy ... but, ONLY for a txt msg! ... read »
Mar 12, 2010 at 8:24 PM
Creating UI Elements With Low-Coupling And Conditional Event Handling
@Ben, Yes, that's exactly what's happening. That's the approach YUI has taken with custom events, you subscribe the handler to the Event object itself. I really like the event system in YUI, it's ... read »
Mar 12, 2010 at 7:34 PM
FLV 404 Error On Windows 2003 Server
I spent a good couple of hours on this today. What a pain. On my old server, everything was fine. I migrated the site to a new server, and suddenly, all the files with audio didn't work. Just got ... read »
Mar 12, 2010 at 7:26 PM
Creating UI Elements With Low-Coupling And Conditional Event Handling
@Ryan, I finally got around to reading that YUI blog post you linked (it took me a fews months, but I did it). I wanted to ask you something (rather than on his only cause it is so old), but from w ... read »