jQuery Autocomplete custom data

Question

I have this code in my script:

$(function() {
        $( "#products" ).autocomplete({
            source: "<?php echo $this->baseUrl ?>/loyalty/autocomplete",
            minLength: 2,
            focus: function( event, ui ) {
                $( "#products" ).val( ui.item.label );
                return false;
            },
            select: function( event, ui ) {
                $("#sel_products").html($("#sel_products").html()+"<tr><td>"+ui.item.value+"</td><td>"+ui.item.id+"</td></tr>");
                return false;
                }
        }).data( "autocomplete" )._renderItem = function( ul, item ) {
            return $( "<li></li>" )
                .data( "item.autocomplete", item )
                .append( item.value)
                .appendTo( ul );
        };
    }); 

The ajax result that autocomplete gets is something like this:

[{label:"Label1",value:"Value1",id:"1"},{label:"Label2",value:"Value2",id:"2"}]

The problem is that my autocomplete list is not created. Nothing happens when I start typing letters, except for ajax being returned. Btw, when I use regular non-custom data, I get the list.

What can be the problem here?

Answer 1

if you're using firebug and using that schema as a source, you can see at the Net that the autocomplete send the term data (using get method), so you have to handle that term in the /loyalty/autocomplete class. What i've done with that problem is, i didn't handle that term, but i just throw the result from the class that provide the data i want (controller class) to the view class. So, in the view class, i just call that data as a source.