jquery autocomplete - json

[pirula08]

I want to implement AutoComplete search functionality to form field using freely available JQuery. Now, I have a fully functional, simplified code that works perfectly with a .cfm page, but I have been struggling to convert it to a cfc file, namely to convert ColdFusion data into a JSON !

here is the working code:

test-autoc.cfm

<script type="text/javascript" src="scripts/jquery-1.3.1.min.js"></script>
<script src="scripts/jquery.autocomplete.js"></script>
<link rel="stylesheet" href="css/autocomplete.css" type="text/css" />

<script type="text/javascript">
$(document).ready(function() {
    $("#topic").autocomplete(
                "auto-complete-q.cfm",
                {
            minChars:2,
            delay:200,
            autoFill:false,
            matchSubset:false,
            matchContains:1,
            cacheLength:10,
            selectOnly:1
                }

           
    );
});
</script>

<form name="testa" id="testa" action="#" method="get">
<p>
<label for="topic">topic</label>
<input type="text" name="topic" id="topic" />
</p>
</form>

auto-complete-q.cfm

<cfinvoke component="Application" method="password" returnvariable="password">
<cfinvoke component="Application" method="username" returnvariable="username">

<cfsetting enablecfoutputonly="true">
<cfparam name="URL.q" default="">

<cfquery name="titleq" datasource="datasource" username="#username#" password="#password#">
SELECT title
FROM latestnews
WHERE title LIKE <cfqueryparam value="%#URL.q#%" cfsqltype="cf_sql_varchar">
</cfquery>

<cfoutput query="qryGetCountry" maxrows="10">
#titleq.title#
</cfoutput>

//////////////////////////////////////////////////////////////////////

and the one I have been struggling with

test-autoc1.cfm

<script type="text/javascript" src="scripts/jquery-1.3.1.min.js"></script>
<script src="scripts/jquery.autocomplete.js"></script>
<link rel="stylesheet" href="css/autocomplete.css" type="text/css" />

<script type="text/javascript">
$(document).ready(function() {
    $("#topic").autocomplete(
                "auto-complete-q.cfc?method=gettitles&returnFormat=JSON",
                {
            minChars:2,
            delay:200,
            autoFill:false,
            matchSubset:false,
            matchContains:1,
            cacheLength:10,
            selectOnly:1
                }

           
    );
});
</script>

I also tried adding source: and aditional {} to the JavaScript code above, but had no luck.

<form name="testa" id="testa" action="#" method="get">
<p>
<label for="topic">topic</label>
<input type="text" name="topic" id="topic" />
</p>
</form>

auto-complete-q.cfc

<cffunction name="gettitles" access="remote" returntype="array">
    <cfargument name="searchparam" type="string" required="false" default="test jjjjj test">
  
    <cfset var titleq = "">
    <cfset var result = arrayNew(1)>
   
 
  <cfquery name="titleq" dataSource="datasource">
    SELECT title
    FROM latestnews
    WHERE title LIKE <cfqueryparam cfsqltype="cf_sql_varchar" value="%#arguments.searchparam#%">
  </cfquery>
  
  <cfloop query="titleq">
    <cfset arrayAppend(result, titleq.title)>
  </cfloop>
      
  <cfreturn result />
</cffunction>

Although the code does not generate any error, for some reason it always selects the default value set in cfargument!?

I also tried replacing LIKE <cfqueryparam cfsqltype="cf_sql_varchar" value="%#arguments.searchparam#%"> with a literal value (LIKE "%whatever%") and in that case cfc actually returns that value if something is typed in the search field. However, when selected returned value outputs the following code  <wddxPacket version='1.0'><header/><data><array length='1'><string>test jjjjj test</string></array></data></wddxPacket> !?

As I can see something is missing in both CFC and JavaScript code!?

CF version - CF MX 7.0.2

[pete_freitag]

I don't think returnformat=JSON works in CF7, you need at least ColdFusion version 8 for that to work. You will need to use some third party code to convert your data into JSON, there are a few cfc's out there that can do the trick. The response you are seeing is in the format of WDDX.

[pirula08]

I don't think returnformat=JSON works in CF7, you need at least ColdFusion version 8 for that to work.

yep, I think you're right.

You will need to use some third party code to convert your data into JSON, there are a few cfc's out there that can do the trick

ok, definitelly I'm gonna learn more about it. In the meantime, what if I replace <cfreturn result /> with say <cfoutput>#result[1]#</cfoutput><cfabort /> it would be a handy workaround for the WDDX issue!? That being said, I am still stuck with the default value issue, given that every time no matter what is typed into the search box the default value set in cfargument will be passed.!?? I would like to solve this issue first! Could someone point out which file is causing the problem, cfc of javascript?