jQuery UI Autocomplete with custom JSON object

Question

jQuery UI Autocomplete (code below) works just fine when the returned JSON is an Array. But my returned JSON is an object that contains an array. So instead of being Rows[] it's Object.Rows[]

I can't seem to get the syntax right below. I would have thought item would have just switched to item.Rows, but that did not seem to work. Help

$('#reportingLocationLookup').autocomplete({
    minLength: 3,
    delay: 1000, //milliseconds,  
    source: function (request, response) {
        var dto = { 'term': request.term, 'take': 10 };
        //Ajax
        var urlMethod = window.siteRoot + "Invoices/ListPostalLocations";
        var jsonData = JSON.stringify(dto);
        window.SendAjax(urlMethod, jsonData, response);
    },
    focus: function () {
        return false;
    },
    select: function (event, ui) {
        return false;
    }
}).data("autocomplete")._renderItem = function (ul, item) {
    return $("<li></li>")
    .data("item.autocomplete", item)
    .append("<a>" + item.PostalCode + " - " + item.CityAlias + ", " + item.StateAbbreviation + "</a>").appendTo(ul);
};

I think you didnt format your code right, something is missing. — Derk Arts
– Derk Arts, Commented Dec 19, 2011 at 16:15
All the code is there. I use this code in other spots and it works just fine when item is an array at the root. But when the array is off the root it doesn't like it. — Mark
– Mark, Commented Dec 19, 2011 at 16:19

Andrew Whitaker · Accepted Answer · 2011-12-19 16:29:35Z

The autocomplete widget expects an Array to be supplied to the response function. What this means is that you're going to have to tweak the success argument of your SendAjax call:

/* snip */
source: function (request, response) {
    var dto = { 'term': request.term, 'take': 10 };
    //Ajax
    var urlMethod = window.siteRoot + "Invoices/ListPostalLocations";
    var jsonData = JSON.stringify(dto);
    window.SendAjax(urlMethod, jsonData, function(data) {
        response(data.Rows);
    });
},
/* snip */

Basically, send response (autocomplete's supplied callback function) the array in your response object.

Collectives™ on Stack Overflow

jQuery UI Autocomplete with custom JSON object

1 Answer 1

Comments

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Related