Coldfusion Ajax/Jquery Question

Posted on 2012-09-07
Last Modified: 2012-09-07
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!
Question by:hefterr
    LVL 36

    Assisted Solution

    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.
    LVL 51

    Accepted Solution

    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

    LVL 51

    Expert Comment

    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.
    LVL 1

    Author Comment

    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,
    LVL 1

    Author Comment

    I think you posted your answer before my question :)
    LVL 51

    Expert Comment

    (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!
    LVL 36

    Expert Comment

    "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....
    LVL 1

    Author Closing Comment

    Thanks to you both!  Very helpful.

    Write Comment

    Please enter a first name

    Please enter a last name

    We will never share this with anyone.

    Featured Post

    Looking for New Ways to Advertise?

    Engage with tech pros in our community with native advertising, as a Vendor Expert, and more.

    Hi, Even though I have created this Tutorial on My personal Blog, Some people might not able to find my website, So here i am posting it again Today, from the topic it is very clear that i will be showing you here the very basic usage of how we …
    Sometimes databases have MILLIONS of records and we need a way to quickly query that table to return the results me need. Sure you could use CFQUERY but it takes too long when there are millions of records. That is why SOLR was invented. Please …
    Migrating to Microsoft Office 365 is becoming increasingly popular for organizations both large and small. If you have made the leap to Microsoft’s cloud platform, you know that you will need to create a corporate email signature for your Office 365…
    This video is in connection to the article "The case of a missing mobile phone (". It will help one to understand clearly the steps to track a lost android phone.

    779 members asked questions and received personalized solutions in the past 7 days.

    Join the community of 500,000 technology professionals and ask your questions.

    Join & Ask a Question

    Need Help in Real-Time?

    Connect with top rated Experts

    16 Experts available now in Live!

    Get 1:1 Help Now