problem with parsing json in jquery autocomplete

Question

I'm having trouble in parsing my JSON data in jQuery autocomplete. My JSON comes from this code:

<cfset theQ = lcase(q)>

<cfquery datasource="#source#" name="qry" maxrows="20">
    select top 10 lastname
    from info
    where
    lower(lastname) like '#theQ#%'
    order by lastname
</cfquery>

<!---
Before we can serialize the query, we need to convert
it to an array of structs.
--->
<cfset rows = [] />

<!--- Loop over the query to convert it. --->
<cfloop query="qry">

<!--- Create a row struct. --->
<cfset row = {} />

<!--- Add each column to our struct. --->
<cfloop
index="column"
list="#qry.columnList#"
delimiters=",">

<cfset row[ column ] = qry[ column ][ qry.currentRow ] />

</cfloop>

<!--- Append the row struct to the row array. --->
<cfset arrayAppend( rows, row ) />

</cfloop>

<!---
Now that we have converted our query to an
array of structs, we can serialize it using the
serializeJSON() method.
--->
<cfset serializedQuery = serializeJSON( rows ) />
<cfoutput>#serializedQuery#</cfoutput>

I converted my query into array of structures and then serialized it to JSON. Now, parsing this JSON in jQuery autocomplete does not work. The data I get looks like this:

[{"lastname":"abc"},{"lastname":"def"},{"lastname":"ghi"}]

Here is the code for autocomplete:

$(document).ready(function() {
    $("#name").autocomplete("data/name.cfm",{
        minChars:1,
        delay:10,
        autoFill:false,
        matchSubset:false,
        matchContains:1,
        cacheLength:10,
        selectOnly:1,
        dataType: 'json',

        parse: function(data) {
            var parsed = [];
            var dataParsed = $.parseJSON(data);
                for (var i = 0; i < dataParsed.length; i++) {
                parsed[parsed.length] = {
                data: dataParsed[i],
                value: dataParsed[i].lastname,
                result: dataParsed[i].lastname
                };
            }

            return parsed;
        },
        formatItem: function(item) {
            return item;
        }

    });

When I type in the text field, I get the whole JSON string as the search result. I've looked into other codes for parsing but still I can't get it working. Any help? Thanks.

References: Simon Whatley for autocomplete; Ben Nadel for query to array of structs and serialize to json

Jesse Cohen · Accepted Answer · 2011-02-24 04:01:12Z

0

One problem is that in your for loop you are iterating up to data.length when you should be iterating up to dataParsed.length

If you are using the Simon Whatley autocomplete plug-in, according to the demo on his website, the plugin simply expected the autocomplete results to be on individual lines, e.g:

abc
def
ghi

So you should get rid of the parse function you provide in jquery, and modify your coldfusion script to return one name per line i.e. abc\ndef\n... No need to use json or anything else. (at least thats how this demo on his website works http://www.simonwhatley.co.uk/examples/autocomplete/jquery/data/country.php)

Just to confirm, you should add an alert('aaa') to the inside of your parse() function, I bet you will see that it is never being called.

edited Feb 24, 2011 at 4:01

answered Feb 24, 2011 at 3:29

Jesse Cohen

4,07025 silver badges25 bronze badges

Sign up to request clarification or add additional context in comments.

5 Comments

danielle Over a year ago

@Jesse Cohen, sorry, that's just a typo error. Even if I've changed that to dataParsed.length, it still doesn't work. I just get the whole json, ie. [{"lastname":"abc"},{"lastname":"def"},{"lastname":"ghi"}] in the text field.

Jesse Cohen Over a year ago

if you tell me which autocomplete plugin for jquery you are using it would help to debug this -- the different plugins expect data in different formats and have different configuration parameters.

danielle Over a year ago

@Jesse, for the jquery autocomplete plugin, I've downloaded it from Simon Whatley www.simonwhatley.co.uk/using-jquery-auto-complete-with-coldfusion

danielle Over a year ago

@Jesse, yeah you're right. The parse function is not called. So, is it okay to pass the results one name per line? Or should I get another plugin that accepts json? I'm a newbie in jquery so maybe you can give suggestions. Thanks!

Jesse Cohen Over a year ago

As I said. Simply return 1 plaintext result per line. No json. And the plugin will work the way you want.

Collectives™ on Stack Overflow

problem with parsing json in jquery autocomplete

1 Answer 1

5 Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

5 Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related