jQuery autocomplete display worng search item

98 views Asked by At

how can jQuery autocomplete match input word with list from json object. When I start typing some word in input field jQuery displays wrong results. I think autocomplete show only list from json object. Dont know what is the problem on this autocoplete. So if you coud give me advice to solve this on some other way. When I select some value in serachbox results this code will append all results to other inputs as value. This is my code:

jQuery

$( document ).ready(
$("#get_search").autocomplete({
                source: function( request, response ) {
                $.ajax({
                    url: "/organizations/",
                    type: "GET",
                    dataType: "json",
                    data: {term: request.term},
                    contentType: "application/json; charset=utf-8",
                    success: function(data) {
                                response($.map(data, function(item) {
                                console.log(item.name);
                                return {

                                    org_name: item.name,
                                    oib: item.oib,
                                    address: item.address,
                                    city: item.city,
                                    postal_code: item.postal_code

                                    };
                            }));
                        }
                    });
                },
                minLength: 2,
                scroll: true,
                select: function(event, ui) {
                    //this.value = ui.item.org_name;
                    //console.log(ui.item.org_name+' '+ui.item.oib+' '+ui.item.address);
                    $('#get_search').val(ui.item.org_name);
                    $('#oib').val(ui.item.oib);
                    $('#address').val(ui.item.address);
                    $('#city').val(ui.item.city);
                    $('#postal_code').val(ui.item.postal_code);
                    return false;
                }

            }).data("autocomplete")._renderItem = function(ul, item) {
    return $("<li>").data("item.autocomplete", item).append("<a><strong>" + item.org_name + "</strong><br>" + item.oib + " - " + item.address + " - " + item.city + "</a>").appendTo(ul);
});

json object

[
    {
        "id": "8",
        "oib": "213214214",
        "name": "asdasdd",
        "address": "asdad",
        "city": "asdasd",
        "postal_code": "asdads"
    },
    {
        "id": "8",
        "oib": "213214214",
        "name": "asdasdd",
        "address": "asdad",
        "city": "asdasd",
        "postal_code": "asdads"
    },
    {
        "id": "8",
        "oib": "213214214",
        "name": "asdasdd",
        "address": "asdad",
        "city": "asdasd",
        "postal_code": "asdads"
    },
    {
        "id": "8",
        "oib": "213214214",
        "name": "asdasdd",
        "address": "asdad",
        "city": "asdasd",
        "postal_code": "asdads"
    },
]

html

<input class="form-control  ui-autocomplete-input" id="get_search" name="form1-name" type="text" autocomplete="off">
0

There are 0 answers