Bootstrap 3 Typeahead не показывает результатов

Я использую Bootstrap 3 Typeahead с вызовом ajax. Функция правильно возвращает данные, но они не отображаются.

Вот мой код:

$('#txtComune').typeahead({
        minLength: 2,
        delay: 400,
        items: 5,
        source: function (query, response) {
            $.ajax({
                url: '<?= $root; ?>/get_comuni',
                dataType: "json",
                type: 'POST',
                data: {
                    query: query
                },
                success: function (data) {
                    response(data.comuni);
                }
            });
        },
        displayText: function (item) {
            console.log(item.comune);
            return item.comune;
        }
    });

Функция console.log возвращает названия всех городов, но раскрывающийся список не отображается в текстовом поле.

Вот мой код текстового поля:

<input name="txtComune" class="form-control input-md" data-provide="typeahead" autocomplete="off" id="txtComune" type="text" placeholder="" maxlength="250">

Вот мои результаты JSON:

{
"exception": false,
"comuni": [{
    "idComune": 1332,
    "comune": "Caraffa di Catanzaro",
    "pv": "CZ",
    "cap": "88050",
    "attivo": 1
}, {
    "idComune": 1831,
    "comune": "Catania",
    "pv": "CT",
    "cap": "951xx",
    "attivo": 1
}, {
    "idComune": 1832,
    "comune": "Catanzaro",
    "pv": "CZ",
    "cap": "88100",
    "attivo": 1
}, {
    "idComune": 3240,
    "comune": "Gravina di Catania",
    "pv": "CT",
    "cap": "95030",
    "attivo": 1
}, {
    "idComune": 4076,
    "comune": "Militello in Val di Catania",
    "pv": "CT",
    "cap": "95043",
    "attivo": 1
}, {
    "idComune": 6258,
    "comune": "San Gregorio di Catania",
    "pv": "CT",
    "cap": "95027",
    "attivo": 1
}]
}

json php jquery ajax bootstrap-typeahead
person Swim89    schedule 28.10.2016    source источник

Ответы (1)


arrow_upward
1
arrow_downward

Пожалуйста, измените это:

source: function (query, response) {
        $.ajax({
            url: '<?= $root; ?>/get_comuni',
            dataType: "json",
            type: 'POST',
            data: {
                query: query
            },
            success: function (data) {
                response(data.comuni);
            }
        });
}

TO

source: function (query, response) {
    return $.get('<?= $root; ?>/get_comuni', { query: query }, function (data) {
        console.log(data);
        return response(data);
    });
}

Вот пример: jsfiddle

person Mihai Alexandru-Ionut    schedule 28.10.2016
comment
Вы можете опубликовать свой json? - person Mihai Alexandru-Ionut; 28.10.2016
comment
@ Swim89, я обновил свой ответ. Я привел пример jsfiddle. - person Mihai Alexandru-Ionut; 28.10.2016