As I talked about earlier, I am starting to get into AJAX and, as a hands-on kind of guy, I do my best learning from building. So, now that I have my XmlHttpRequest wrapper, I have created some functions for the server side of things that convert ColdFusion objects into Javascript objects that are going to be passed back to the browser.

If you remember from before, my AJAX wrapper is designed to evaluate the data returned from the server via the XmlHttpRequest (ex. eval( objConnection.responseText )). Javascript is a wicked-sweet interpreted language and I have found it very convenient to return Javascript code that will be evaluated into objects that most closely resemble their ColdFusion counterparts. The following methods are used to convert ColdFusion queries and structs to Javascript objects.

This method takes a ColdFusion query and return the Javascript code that would be used to model it via an array of objects. It returns a string in the form of: new Array(new Object(), new Object(), new Object()):

On the Javascript side, you could use this evaluated object in the same manner you would a query:

// Loop over the rows in the "query" which is now an array.

for (var intRow = 0 ; intRow < arrResults.length ; intRow++){

// Loop over each column and alert.

for (var strColumn in arrResults[ intRow ]){

alert( strColumn + " : " + arrResults[ intRow ][ strColumn ] );

}

// Or, you can call columns directly.

alert( arrResults[ intRow ].id );

alert( arrResults[ intRow ].name );

}

The following method takes ColdFusion structures and creates the Javascript code for creating an object in the form of: new Object({ a:3, b:7, ....}). As I stated before, I am not thinking about nested objects just yet. I will cross that bridge shortly. For the moment, while I am learning about AJAX, I am just going to work with structures containing simple values:

On the Javascript side of things, you can reference the structure keys just as you would in ColdFusion:

alert( objData.id );

alert( objData.name );

Next step is to create a recursive function that can handle nested data types.

Now, you might be thinking, why not just use CFWDDX to convert the ColdFusion objects to Javascript objects? One, cause I am learning more by making my own conversion. Two, CFWDDX has to create a top-level Javascript variable to hold the data, which is completely unnecessary in AJAX. And Three, CFWDDX is just not that efficient (in terms of code size). Take for instance trying to convert the following ColdFusion struct to a Javascript object:

<cfset objTest = StructNew() />

<cfset objTest.id = 1 />

<cfset objTest.name = "ben nadel" />

<cfset objTest.rich = false />

<cfset objTest.smart = true />

<cfset objTest.girlfriend = "molly" />

<cfset objTest.mood = "freakin' sweet" />

Using the CFWDDX - CFML2JS, we would get Javascript code like:

objData = new Object();

objData["mood"] = "freakin\' sweet";

objData["girlfriend"] = "molly";

objData["name"] = "ben nadel";

objData["id"] = "1";

objData["rich"] = "false";

objData["smart"] = "true";

That's 193 characters to return. Using my method, we would get Javascript code like:

new Object({

mood:"freakin\' sweet",

girlfriend:"molly",

name:"ben nadel",

id:"1",

rich:"false",

smart:"true"

})

That's 106 characters to return. That's a difference of about a half the characters that the server will have to return to the browser. Currently, my methods are not the best at projecting crazy keys like the CFWDDX is, but that will change shortly.

What's frustrating is that in the QueryToArray() method, when I am creating an object, I can use just { } notation since it is being evaluated as part of a parent array; however, I can't just return "{}" in the StructToObject() method as it doesn't know to evaluate directly to an Object. Hence, the use of "new Object()" in the latter method.

Sorry for the LINK in the code; this post does not allow the proper html link.This is all inside a cfquery loop/output. The sturcture 'row' is created by another custom function.What I need to do is to pass on the jsobjects variable to a javascript function. But...the StructToObject function puts double quotes around values of each key and so I get an unterminated string javscript error when clicking on the Edit link in above code.

In case you are wondering, the idea is to pass the query's output with both column-names and values as an associative array to a javascript function and then use that function to populate a form in a CFWindow. But I am unable to make it work as of now and so am directing to a new page for edit functionality using url.specialtyid.