4 Replies Latest reply on Jan 19, 2017 12:55 PM by Blue Chrome

    Very Basic Javascript Call to CFC help

    Blue Chrome

      I'm trying to venture into AJAX a little, and am facing some obstacles.  First, for full disclosure, we're running Coldfusion 7 (I know, I know...).

       

      I set up my cfc page (16_echAjax.cfc) with the following basic code:

       

      <cfcomponent

           output="false">

           <cffunction

                name="helloWorld"

                access="remote"

                returntype="string"

                output="false" >

                <cfargument

                     name="name"

                     type="string"

                     required="no"  />

                <cfif isDefined("arguments.name") AND arguments.name NEQ "">

                     <cfreturn "Hello, #arguments.name#" />

                <cfelse>

                     <cfreturn "Hello, Nameless" />

                </cfif>

           </cffunction>

      </cfcomponent>

       

      When I open a browser and type in "16_echAjax.cfc?method=helloWorld&name=Bob", the page opens and I see "Hello, Bob", so I know the coldfusion is working.

       

      On my return page (16_echAjaxReply.cfm), I have a button that calls the "myCall" function and shows the response in a text box called "results".  My javascript code looks like this:

       

      <script>

          function myCall() {

              var request = $.ajax({url: "16_echAjax.cfc?method=helloWorld&name=Bob"});

             document.getElementById("results").value = request;   

          }

      </script>

       

      But when I click on the button, the text that shows up in "results" is "[object Object]".  Obviously, I'm looking for "Hello, Bob" to show up in "results" - any help would be appreciated.

        • 1. Re: Very Basic Javascript Call to CFC help
          sdsinc_pmascari Level 2

          When working with AJAX it's imperative that you use a browser plugin like FireBug so you can see what is being sent to and from your CFCs.  This would most certainly show you what the [object Object] is.  Step 1 is for you to get that and monitor its Console during AJAX calls.

           

          There are many ways to go about this but one of the most reliable I've found is specifying for jQuery AJAX calls to use datatype: "JSON".  Please review the docs here: http://api.jquery.com/jquery.ajax/

           

          Next, for the return type in your CFC, I like to build the return data into STRUCTS and set the function output=YES.  You can then output your function results as JSON using #serializeJSON()# and the jQuery AJAX will pick this up.  One weird thing is the var in JS is always capitalized.  For instance, if your CFC is something like this:

           

          <cffunction

                    name="helloWorld"

                    access="remote"

                    output="true" >

              

               <cfset returnStruct = {var1='yes',var2='no'}>

           

               <cfoutput>#serializeJSON(returnStruct)#</cfoutput>

           

          </cffunction>

           

          Your AJAX could be something like:

           

          $.ajax({

                          type: "GET",

                          url: "yourcfc.cfc",

                          data:{

                              method: "helloWorld"

                          },

                          dataType: "json",

                          success: function(data){

                              document.getElementById("results").value = data.VAR1;

                         }

               });

           

          Hope that helps.

          • 2. Re: Very Basic Javascript Call to CFC help
            Blue Chrome Level 1

            Thanks for your quick response.  Because I'm using Coldfusion 7, I'm not sure the JSON commands are in the Coldfusion library.  I changed the code to what you have above, and when I run just the 16_echAjax.cfc?method=helloWorld&name=Bob in a browser, I get an error saying: "Variable serializeJSON is undefined".

             

            When I try running it via the 16_echAjaxReturn.cfm, nothing appears in the results box, and my console says:

            jquery.min.js:4 GET 16_echAjax.cfc?method=helloWorld 500 (Internal Server Error)

            send @ jquery.min.js:4

            ajax @ jquery.min.js:4

            myCall @ 16_echAjaxReturn.cfm:26

            onclick @ 16_echAjaxReturn.cfm:69

            • 3. Re: Very Basic Javascript Call to CFC help
              sdsinc_pmascari Level 2

              Not sure of your FireBug setup but you should be able to expand the entry and view the details of what's going on.  There's even an HTML tab which will show you any CF error that occurs which is what looks like is going on here because CF7 doesn't have the JSON functions.

               

              You will want to find another function to convert your CF to JSON.

               

              Here's a UDF: CFLib.org – jsonencode

               

              Ben Nadel also has a utility:

              JsonSerializer.cfc - A Data Serialization Utility For ColdFusion

              • 4. Re: Very Basic Javascript Call to CFC help
                Blue Chrome Level 1

                AAAHHHH!!!  You ROCK!

                 

                I used the CFLib.org version, works like a charm.  Thanks!