CODEWITHSUNDEEP
jqueryautocomplete
Lakshman Pilaka
Lakshman Pilaka

Reputation: 1951

JQuery Autocomplete doesn't filter results

Yeah, there are many questions in the forum but somehow none works for me. I am not doing very special.

My Autocomplete is populating the results but the results are not getting filtered

My code is :

$("#empName").autocomplete({
    source: function(request, response) {
        $.ajax({
            url: "api/clientEmp/of/" + sessionClientId + "/notingroup/" + groupId,
            type: "GET",
            dataType: "json",
            data: {
                term: $("#empName").val()
            },
            success: function(data) {
                response($.map(data, function(item) {
                    return {
                        label: item.EmpName,
                        value: item.EmpId
                    };
                }));
            }
        });
    },
    minLength: 0,
    focus: function(event, ui) {
        $("#empName").val(ui.item.label);
    }
});

And the json output is something like this

[
    {
        "EmpId": 26,
        "EmpNum": "Rel-72015-31",
        "EmpName": "R.durai"
    },
    {
        "EmpId": 21,
        "EmpNum": "REL-42015-22",
        "EmpName": "Zishan"
    },
    {
        "EmpId": 56,
        "EmpNum": "Rel-22015-19",
        "EmpName": "Raj Singh"
    }
]

It neatly shows the options but when i type anything this all results shows up and they are not filtered

I am missing a piece of code which asks to filter the results. Can anyone please suggest.

thanks in advance.

Upvotes: 0

Views: 1096

Answers (1)

guvenckardas
guvenckardas

Reputation: 738

$("#empName").autocomplete({
 source: function(request, response) {
    $.ajax({
        url: "api/clientEmp/of/" + sessionClientId + "/notingroup/" + groupId,
        type: "GET",
        dataType: "json",
        data: {
            term: $("#empName").val()
        },
        success: function(data) {
            var array = $.map(data, function(item) {
                return {
                    label: item.EmpName,
                    value: item.EmpId
                };
            });

             //call the filter here
                response($.ui.autocomplete.filter(array, request.term));
        }
    });
},
         minLength: 0,
      focus: function(event, ui) {
        $("#empName").val(ui.item.label);
      }
   });

Upvotes: 6

Related Questions