Coldfusion Ajax/Jquery Question

I am working with a client side programmer using Jquery/AJAX for a modal popup.  This is the first time I am working with native AJAX as opposed to CF BIFs.

The client side programmer (new and not familar with CF8) invokes the server side AJAX call by using a basic HTTP call directly to a CF program :

if ($.trim(data)==""   NO ERROR etc

Basically she is calling a coldfusion program (I am writing) similar to a CFHTTP server call and tests the results of the page returned.

Now I learned you are supposed to write a remote CFC and the JQuery should invoke the remote CFC
Q:  what is that syntax to invoke the cfc?

The CFC then returns data
Q:  does it need to be explicitly converted to JSON format?

Main Q:  What is the difference?  This method we are using seems very simple and straight forward.  The server only returns an error string or an empty string (no error).

Thanks in advance!
Who is Participating?
_agx_Connect With a Mentor Commented:
Q:  what is that syntax to invoke the cfc?

Depends on the cfc, and what the receiving jquery code needs to do with the results.  Most times jquery works with json. The basic syntax to invoke a cfc is:


Open in new window

With the CFC below, here's how you'd invoke the 3 methods. You can test it in a browser to see the results.

One important thing to remember if you return structures is that CF upper cases all structure keys, which will break your jquery if it's not expecting it. To preserve the case you must use structure notation ie structName["keyName"] - and not dot notation ie structName.keyName

call:  http://localhost/path/to/YourComponent.cfc?method=testSimple&returnformat=json&name=John
result:   "return something here..."

call:  http://localhost/path/to/YourComponent.cfc?method=testWithArgs&returnformat=json&name=John
result:   "Hello John"

call:  http://localhost/path/to/YourComponent.cfc?method=testComplexData&returnformat=json
result: {"error":"","data":"yippee"}

	<cffunction name="testSimple" access="remote">
		<cfreturn "return something here...">
	<cffunction name="testWithArgs" access="remote">
		<cfargument name="name" type="string">
		<cfreturn "Hello "&>
	<cffunction name="testComplexData" access="remote">
		<cfset var result = {}>
		<cfset result["error"] = "">
		<cfset result["data"] = "yippee">
		<cfreturn result>

Open in new window

SidFishesConnect With a Mentor Commented:
syntax is basically

<cffunction name="something" remote="true" returntype="seedocsforlist" returnformat="json">

do stuff

<cfset results = "something"> or use a query named results

<cfreturn results>

The difference is that you have far more control over a cfc than a cfm file. CFC's were invented just for this.
To add to what Sid said, if you're just returning a simple string it probably makes little difference. The advantages are when you need to return complex objects, such as structure with "data" and "errors".  Just throw the code in a function, tack "returnformat=json" onto your url and you've got a well formatted JSON response. Not to mention you can have multiple remote functions in a CFC. Returning multiple responses from a cfm script is more clumsy.
Free Tool: Site Down Detector

Helpful to verify reports of your own downtime, or to double check a downed website you are trying to access.

One of a set of tools we are providing to everyone as a way of saying thank you for being a part of the community.

hefterrAuthor Commented:
OK, I get the communications (very helpful).  But what does this do for me as opposed to the simple page result technique (I am currently using).
-  I know you can use cfdebug?

Anything else?  Just trying to understand better what is going on one way versus the other.

Thanks again,
hefterrAuthor Commented:
I think you posted your answer before my question :)
(Didn't see the last response, but since I'd already typed this up ... :-)

If you're just returning a simple string ... it buys you very little. Aside from proper encapsulation. The advantages are when you need to return complex data OR return the data in different formats.  CFC's make that much easier.  

Say you wanted to use the testComplexData() function in your CF code, but also from jquery.  You can't do that easily with a cfm page. At the very least it'd require clumsy code like

             <cfif wasCalledFromJquery>
                         return as json
                        return regular CF objects

With cfc's the calling page just tacks on a parameter and it's bundled automatically.  

Plus, functions can suppress output and whitespace which is big problem with JSON. As extra spaces can break the jquery.  CFC's do that automatically.  In a cfm page you have to handle it manually.  Forget to set all the right tags (cfsetting, cfsilent, etc...) and you'll get extra output and be scratching your head wondering why the jquery refuses to work.  I spent an hour on that very problem just recently!
"functions can suppress output and whitespace which is big problem with JSON"

oh yes it is... and cfm files love to add lots of whitespace...

The other thing that CFC's are great for is code reuse and separation of logic from display. Additionally you can expose data as a webservice to anything that can consume that data - doesn't have to be CF driven

May or may not apply to your situation but good things to know....
hefterrAuthor Commented:
Thanks to you both!  Very helpful.
Question has a verified solution.

Are you are experiencing a similar issue? Get a personalized answer when you ask a related question.

Have a better answer? Share it in a comment.

All Courses

From novice to tech pro — start learning today.