CODEWITHSUNDEEP
jqueryautocomplete
Nicolas Blaudez
Nicolas Blaudez

Reputation: 107

Jquery autocomplete not display result box

I have this js script :

$('#other_teacher').autocomplete({
    source: function (request, response) {
        $.ajax({
            url: '/app_dev.php/en/teacher/ajax/courseadd-teacher/'+request.term,
            type: 'GET',
            dataatType: 'json',
            success: function(data) {
                console.log(data);
                response($.each(data, function(index, value) {
                    return {
                        label: value,
                        value: index
                    }
                }));
            }
        });
    },
    minLength: 1
});

And the result of ajax request is :

[{"id":2,"name":"Moran bob"},{"id":2,"name":"Willam Lawsan"}]

Ajax resquest start, data have the result object, but result window is not displayed.

Upvotes: 1

Views: 124

Answers (2)

dcodesmith
dcodesmith

Reputation: 9614

Use $.map instead of $.each and then access the value of the fields from the object. I also added a select function and a logger inside to confirm check if you're actually getting anything

$('#other_teacher').autocomplete({
    source: function (request, response) {
        $.ajax({
            url: '/app_dev.php/en/teacher/ajax/courseadd-teacher/'+request.term,
            type: 'GET',
            dataatType: 'json',
            success: function(data) {
                console.log(data);
                response($.map(data, function(item) {
                    return {
                        label: item.id, // or item.name if you want
                        value: item.name
                    }
                }));
            }
        });
    },
    minLength: 1,
    select: function (event, ui) {
        console.log(ui.item);
    }
});

Upvotes: 1

Dinesh
Dinesh

Reputation: 1007

put Css for autocomplete and then try this code

   $('#textbox id').autocomplete({
        source: function (request, response) {
            $.getJSON("url?term=" + request.term, function (data) {
                response(data);

            });

        },
        minLength: 1,
        delay: 100

    });

Upvotes: 0

Related Questions