jQuery UI Autocomplete Not Filtering Data

Question

So I searched but could not find the answer. This could be something trivial however I just can't see what is causing this.

I'm using the jQuery UI Autocomplete, it's displaying the json results. So I know my JSON is valid. However, it's not filtering anything. So I can enter a number and it just show's all of the data. Any tips would be very much appreciated!

I appreciate your time!!

Here is my autocomplete code.

    $.widget('custom.catcomplete', $.ui.autocomplete, {
    _renderMenu: function(ul, items) {
        var self = this,
            currentCategory = '';
        $.each(items, function(index, item) {
            if (item.category != currentCategory) {
                ul.append('<li class="ui-autocomplete-category">' + item.category + '</li>');
                currentCategory = item.category;
            }
            self._renderItem(ul, item);
        });
    }
   });


   $('#category').catcomplete({
    source: function(request, response) {
        $.ajax({
            url: '/wp-content/plugins/pagelines-sections/searchbar/products.json',
            dataType: 'json',
            data: {
                term: request.term
            },
            cache: true,
            success: function(data) {
                response($.map(data.products, function(item) {
                    return {
                        category: item.category,
                        label: item.label,
                        value: item.value
                    };
                }));
            }
        });
       },
       minLength: 1
   });

Answer 1

Filtering must be performed server-side, based on "Term" parameter. Check, what data your server returns with Firebug or Chrome developer tools (F12), and ensure, that it depends on "term" parameter.