JQuery автозаполнение не отображается правильно

Question

Я использую jQuery Autocomplete с JSON, но полученные данные отображаются неправильно. Если вы перейдете на http://whatsmybeer.com и наберете «firestone», вы получите выпадающий список, который гласит «Не определено» с правильным количеством результатов, но JSON отображается неправильно Вы можете увидеть пример вывода JSON, который вызывается из javascript http://whatsmybeer.com/search.inc.php?beer=firestone&callback=?

Мой JS-скрипт для отображения результатов JSON.

<script>
    $(document).ready(function() {
        $( "#REMOTE" ).autocomplete({
            source: function( request, response ) {
                url = "search.inc.php?beer=" + request.term;
                $.getJSON(url + '&callback=?', function(data) {
                    response(data);
                });
            }
        });
    });
</script>

Что я делаю не так с разбором?

Answer 1

Прежде всего, я бы limit the search result to 10 или что-то еще - первый ответ с тысячами или любым количеством пива, которое у вас есть, убивает браузер, когда он пытается обработать данные для отображения.

Далее я бы установил параметр minLength для autocomplete в 2, так как установка одной буквы излишне для стороны сервера, так как если кто-то введет 'a', он, вероятно, вернет половину базы данных (если вы не хотите включать ограничение на возвращаемое количество), добавление автозаполнения после ввода 2-й буквы более естественно, особенно для больших баз данных.

И самое главное - вам нужен ответ JSONправильно отформатирован.

вы возвращаете объект с помощью:

{ 
    beer_name: "name" 
}

и вы должны вернуть:

{
    label: "autocomplete display value",
    value: "input value after selection"
}

если метка и значение совпадают, это должно бытьдостаточно, чтобы предоставить только label, и вы можете спокойно пропустить дублирование в value