Not getting a return from remote coldfusion method with jQuery ajax call

Question

Update2:

Here is jQuery included (along with current jQuery):

<script type="text/javascript" src="/honors/thesis_submission/js/jquery-ui.js"></script>

domain is http://uwf.edu

$(document).ready(function() {
$('#advisor_email').autocomplete({source: "/honors/thesis_submission/cfc/advisors.cfc?method=advisorLookUp&returnFormat=json", minLength: 2});
});

Updated method:

<cffunction name="advisorLookUp" access="remote" output = "false" returntype="any">
        <cfargument name="term" type="string" required="no">
        <cfset var advisorLookUp = "">
        <cfset var a = []>
        <cfset var s = {}>

        <cfquery name = "advisorLookUp" datasource = "#dsn#">
        SELECT id, email
        FROM budPerson
        WHERE email like <cfqueryparam cfsqltype="cf_sql_varchar" value = "#trim(arguments.term)#%">
        </cfquery>

        <cfloop query = "advisorLookUp">
            <cfset s = StructNew()>
            <cfset s["id"] = id>
            <cfset s["label"] = email>
            <cfset s["value"] = email>
            <cfset arrayAppend(a,s)>
        </cfloop>


        <cfreturn a>
    </cffunction>

Form:

<cfform enctype="multipart/form-data" name = "coversheet">
<!-- other fields excluded -->
<input name="advisor_email" type="text" id="advisor_email" size="40"> 
<!-- other fields excluded -->
</cfform>

Note again...I was able to get this working by putting the SAME code that is in my method on a regular cfm page and just cfoutputing...weird much? :\ I'd like to get it working through the remote method in my cfc.

Update:

Switch to jQuery UI and updated my code to match it. I'm still not getting a response remotely from my method.

--

I'm trying to setup a jQuery Autocomplete plugin (specifically: http://bassistance.de/jquery-plugins/jquery-plugin-autocomplete/).

I would just use the coldfusion build in autocomplete, but it was not working for me (giving me an error that apparently I can do nothing about.)

Anyway, my remote method in my cfc will not give me a response. Firebug acts like it is all good and stuff, but doesn't actually give me a return.

Here is my function:

<cffunction name="advisorLookUp" access="remote" returntype="any">
        <cfargument name="q" type="string" required="yes">
        <cfset var advisorLookUp = "">
        <cfset var arr = "">


        <cfquery name = "advisorLookUp" datasource = "#dsn#">
        SELECT id, email
        FROM budPerson
        WHERE email like <cfqueryparam cfsqltype="cf_sql_varchar" value = "#trim(arguments.q)#%">
        </cfquery>

        <cfsavecontent variable="arr">
        <cfoutput query = "advisorLookUp">
            #advisorLookUp.email# | #advisorLookUp.id# 
        </cfoutput>
        </cfsavecontent>

        <cfreturn arr>
</cffunction>

I have the return being formatted the way the plugin wants. Well, that doesn't really matter I guess...I really just want to know I'm getting a response (which I'm not at the moment).

Here is my jQuery calling the method:

$('#advisor_email').autocomplete(
     "/honors/thesis_submission/cfc/advisors.cfc?method=advisorLookUp&returnFormat=json");

I've tested the method without the jQuery by just doing a invoke and it works just fine. Any ideas?

Answer 1

Which version of ColdFusion are you running? If not the latest (version 9) then you may need to add the following if-statement to the onRequestStart() method in your Application.cfc to address a bug whereby the presence of the onRequest() function messes with remote calls:

<cffunction name="onRequestStart" returnType="boolean" output="false">
    <cfargument name="thePage" type="string" required="true">

    <!--- Other code in your onRequestStart method --->

    <!--- Add the following to the end of your onRequestStart method --->
    <cfif ListLast( arguments.thePage,"." ) IS "cfc">
        <cfset StructDelete( this, "onRequest" )>
        <cfset StructDelete( variables,"onRequest" )>
    </cfif>
    <cfreturn true>
</cffunction>

This detects if the request a remote cfc call and removes the onRequest function.

(NB: Make sure "arguments.thePage" matches whatever name you have declared for that argument. Some people name it TargetPage or such like. Doesn't matter as long as it matches the name you declare.)

Answer 2

I'm assuming you include jquery before jqueryui in your calling page. Anyway this works, on testpage set it back to the path to your cfc

testpage.cfm

<html>
<head>
    <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.3/jquery.min.js"></script>
    <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.8.16/jquery-ui.min.js"></script>
</head>

<body>
<cfform name = "coversheet">
<!-- other fields excluded -->
<input name="advisor_email" type="text" id="advisor_email" size="40"> 
<!-- other fields excluded -->
</cfform>

<script>
$(document).ready(function() {
$('#advisor_email').autocomplete({source: "cfcs/advisors.cfc?method=advisorLookUp&returnFormat=json", minLength: 2});
});

</script>


</body>
</html>

advisors.cfc

<cfcomponent>

    <cffunction name="advisorLookUp" access="remote" output = "false" returntype="any">
        <cfargument name="term" type="string" required="no">
        <cfset var advisorLookUp = "">
        <cfset var a = []>
        <cfset var s = {}>
    <!--- no dsn so hardcode some data --->
        <cfset hardcodeData = queryNew("id, email")>
        <cfset queryAddRow(hardcodeData)>
        <cfset querySetCell(hardcodeData, "id", 1)>
        <cfset querySetCell(hardcodeData, "email", "petra@xyz.com")>
        <cfset queryAddRow(hardcodeData)>
        <cfset querySetCell(hardcodeData, "id", 2)>
        <cfset querySetCell(hardcodeData, "email", "pete@abc.com")>
        <cfset queryAddRow(hardcodeData)>
        <cfset querySetCell(hardcodeData, "id", 3)>
        <cfset querySetCell(hardcodeData, "email", "peter@abc.com")>

    <!--- now spoof the query --->
        <cfquery name = "advisorLookUp" dbtype="query">
                SELECT id, email
                FROM hardcodeData
                WHERE email like <cfqueryparam cfsqltype="cf_sql_varchar" value = "#trim(arguments.term)#%">
         </cfquery>


        <cfreturn advisorlookup> 
    </cffunction>
</cfcomponent>

Entering "pe" in the input box generates this in firebug responses

{"COLUMNS":["ID","EMAIL"],"DATA":[["1.0","petra@xyz.com"],["2.0","pete@abc.com"],["3.0","peter@abc.com"]]}

yes returning the query, you could fiddle if you wanted the return formatted differently

like you had it

   <cfloop query = "advisorLookUp">
        <cfset s = StructNew()>
        <cfset s["id"] = id>
        <cfset s["label"] = email>
        <cfset s["value"] = email>
        <cfset arrayAppend(a,s)>
    </cfloop>

    <cfreturn a> 

Answer 3

As Tentonaxe mentions, set returnformat to json, and CF will take care of serialising and returning your struct in what looks to be correct format (at least for the JQuery version of AutoComplete)

Answer 4

After wrestling with this....I decided to just put the coldfusion code in my method just on some page (ajax.cfm) and do the remote call that way. It works...now. However, if anyone knows how to get this to work with a remote call to a method in a cfc I would be much happier.

<cfparam name="url.term" default = "">
<cfset  a = []>
<cfset s = {}>

        <cfquery name = "advisorLookUp" datasource = "#dsn#">
        SELECT id, email
        FROM budPerson
        WHERE email like <cfqueryparam cfsqltype="cf_sql_varchar" value = "#trim(url.term)#%">
        </cfquery>

        <cfloop query = "advisorLookUp">
            <cfset s = StructNew()>
            <cfset s["id"] = id>
            <cfset s["label"] = email>
            <cfset s["value"] = email>
            <cfset arrayAppend(a,s)>
        </cfloop>

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