jQuery Autocomplete .data(“autocomplete”) is undefined

Question

When I try to implement auto-complete using the code below I get an error stating:

.data(\"autocomplete\") is undefined

How ever if I remove th

Answer 1

Actually in your success function you are calling response and returning an object like

return {
           label: item.name,
           image: item.picture,
           json: item,
       }

but in the following line

return $("
").data("item.autocomplete", item).append("" + item.label + " Number of Likes: " + item.likes).appendTo(ul);

you are using item.likes that is not available in your returned object, so it's the problem. I think you can use it like

success:function(data) {
    var result = $.map(data, function (item){
    return {
            label: item.name,
            image: item.picture,
            item.likes 
        };
    });
    response(result);
}

Also keep the item.label inside the (it may not a cause for the error), like

return $("
").data("item.autocomplete", item).append(""+item.label+"").appendTo(ul);

and make sure in the following line

$.map(data.data, function (item) // notice data.data

whether it should be data.data or only data. You can also remove the json: item from the object because you didn't use it anywhere, as far as I'm concerned.

Update: Change following line

.data("autocomplete")._renderItem = function (ul, item) {...};

to

.data("autocomplete")?._renderItem = function (ul, item) {...}; // notice the ? mark

or

if(typeof $('#Your_Input_Id').val()!="undefined")
{
    $('#Your_Input_Id').autocomplete({....});
}

or

var mydata=$('#Your_Input_Id').autocomplete(...).data('autocomplete');
if(mydata)
    mydata._renderItem = function (ul, item) {...};