typeahead.js ищейка minLength не работает

Я реализовал typeahead.js и Bloodhound с удаленным источником данных, и в основном это работает так, как ожидалось. Тем не менее, я установил minLength для typeahead на 2, и хотя я вижу, что запрос ajax срабатывает после 2 символов (и 3), typeahead предлагает предложения только после 4 символов или более. Чего-то не хватает в моей конфигурации (я использую typeahead.bundle.min.js).

var local_authorities = new Bloodhound({
    datumTokenizer: function (datum) {
        return Bloodhound.tokenizers.whitespace(datum.value);
    },
    queryTokenizer: Bloodhound.tokenizers.whitespace,
    identify : function(datum) {
        //console.log(datum);
        return datum.value;
    },
    remote:  {
        url: "/addresses/autocomplete_local_authorities/%QUERY",
        wildcard: '%QUERY',
        filter: function (data) {
            // Map the remote source JSON array to a JavaScript object array
            return $.map(data.local_authorities, function (local_authority) {
                return {
                    id: local_authority.id,
                    value: local_authority.name
                };
            });
        }
    }
});

$('.typeahead.local-authority').typeahead({
    hint: true,
    highlight: true,
    minLength: 2,        
}, {
    limit: 8,
    source: local_authorities,
    displayKey: 'value',
})
.on('typeahead:selected', function (e, item) {
    $('[name="local_authority_ids"').val(item.id);
});

Спасибо.


typeahead.js typeahead bloodhound
person TimSpEdge    schedule 13.05.2015    source источник
comment
не могли бы вы создать демонстрацию на jsfiddle.net?   -  person Dhiraj    schedule 14.05.2015
comment
Спасибо. Я настроил этот jsfiddle, но столкнулся с другой проблемой: jsfiddle.net/zy3xtpzt/4 я не удалось заставить ищейку отправлять почтовые запросы (что-то, что мне изначально пришлось обойти), поэтому он не может получить данные из /echo/json в jsfiddle.   -  person TimSpEdge    schedule 15.05.2015

Ответы (1)


arrow_upward
6
arrow_downward

Некоторая отладка показала, что это вызвано функцией async(suggestions) (строки 1719-1727):

function async(suggestions) {
     suggestions = suggestions || [];
     if (!canceled && rendered < that.limit) {
          that.cancel = $.noop;
          rendered += suggestions.length;
          that._append(query, suggestions.slice(0, that.limit - rendered));
          that.async && that.trigger("asyncReceived", query);
     }
}

Ошибка вызвана установкой rendered в suggestions.length перед вызовом append, поэтому, когда Bloodhound получает 5 или более результатов для запроса, suggestions.slice(0, that.limit - rendered) всегда пусто, так как стандартное limit равно 5.

Предложения добавляются только в том случае, если удаленная конечная точка возвращает менее limit объектов, что происходит в вашем случае для 4 букв и более.

Поскольку я не разработчик Typeahead или Bloodhound, я не хочу (и не имею времени) разбираться, почему это реализовано именно так и как это можно исправить, однако быстрый обходной путь — увеличить limit .

Он должен быть установлен во втором объекте конфигурации, например. $( "#someId" ).typeahead( { ... }, {..., limit: 10, ...});

EDIT: использование typeahead/bloodhound v. 0.11.1

person gapvision    schedule 19.05.2015
comment
Спасибо, что нашли время, чтобы отладить это. Ваш обходной путь решил мою проблему. - person TimSpEdge; 20.05.2015
comment
Это до сих пор не исправлено ... надеюсь, к 2020 году Твиттеру удастся собраться. Что-то я сомневаюсь :) - person Jeffz; 30.01.2018