twitter bootstrap typeahead 2.0.4 ошибка ajax

У меня есть следующий код, который определенно возвращает правильный результат данных, если я использую версию 2.0.0, но по какой-то причине плагин bootstrap typeahead выдает мне ошибку. Я вставил его ниже образца кода:

<input id="test" type="text" />

$('#test').typeahead({
    source: function(typeahead, query) {
        return $.post('/Profile/searchFor', { query: query }, function(data) {
            return typeahead.process(data);
        });
    }
});

Когда я запускаю этот пример, я получаю ошибку jQuery, которая говорит следующее:

**
item is undefined
matcher(item=undefined)bootst...head.js (line 104)
<br/>(?)(item=undefined)bootst...head.js (line 91)
<br/>f(a=function(), b=function(), c=false)jquery....min.js (line 2)
<br/>lookup(event=undefined)bootst...head.js (line 90)
<br/>keyup(e=Object { originalEvent=Event keyup, type="keyup", timeStamp=145718131, more...})bootst...head.js (line 198)
<br/>f()jquery....min.js (line 2)
<br/>add(c=Object { originalEvent=Event keyup, type="keyup", timeStamp=145718131, <br/>more...})jquery....min.js (line 3)
<br/>add(a=keyup charCode=0, keyCode=70)jquery....min.js (line 3)
<br/>[Break On This Error]
<br/>return item.toLowerCase().indexOf(this.query.toLowerCase())**

Есть предположения? ... Тот же код работает в версии плагина 2.0.0, но не может записать в мою нокаутирующую объектную модель.

ЭТО РАБОТАЮЩИЙ КОД ДЛЯ ВЕРСИИ 2.0.0:

var searchFunction = function(typeahead, query) {
        $.ajax({
            url: "/Profile/searchFor?tableName=" + tableName + "&query=" + query + "&extendedData=" + $("#" + extendedData).val(),
            success: function(data) {
                if (data.errorText != null) {
                    toggleLoading("false");
                    showDialog(data.errorText, "Error");
                    return;
                }
                var result = data.results.split("::");
                typeahead.process(result);
            },
            select: function(event, ui) {
            }
        });
    }

    $("#" + inputBoxId).typeahead({
        source: searchFunction,
        onselect: function(obj) {
        }
    });

person Adam Levitt    schedule 24.06.2012    source источник
comment
и какая полная ошибка пожалуйста   -  person Esailija    schedule 24.06.2012
comment
Добавил больше информации в исходный пост.   -  person Adam Levitt    schedule 24.06.2012
comment
В Bootstrap typeahead source должен быть массивом. twitter.github.com/bootstrap/javascript.html#typeahead   -  person Esailija    schedule 24.06.2012
comment
Также невозможно, чтобы это работало в 2.0.0: github .com/twitter/bootstrap/blob/ В коде есть только одно место, где source используется в качестве аргумента для $.grep.   -  person Esailija    schedule 24.06.2012
comment
В любом случае я не могу заставить вызов AJAX работать для версии 2.0.4 опережающего ввода, даже если я верну результаты вызова ajax в виде массива. Похоже, дело даже не в вызове ajax.   -  person Adam Levitt    schedule 24.06.2012
comment
bootstrap typeahead работает только с простым и простым массивом, как показано в документации и даже в исходном коде... вы должны использовать автозаполнение пользовательского интерфейса jQuery или что-то еще.   -  person Esailija    schedule 24.06.2012
comment
На самом деле раньше я заставлял его работать с удаленным источником данных, но по какой-то причине, если я динамически добавляю поле ввода на страницу, оно не работает должным образом. Это очень странно.   -  person Adam Levitt    schedule 24.06.2012
comment
Код в нижней части исходного поста выполняет вызов удаления typeahead, используя версию 2.0.0 плагина typeahead.   -  person Adam Levitt    schedule 24.06.2012
comment
Это не тип начальной загрузки, он не вызывает source как функцию и даже не имеет метода .process. Можете ли вы дать ссылку на сайт, используя это? Или сделать jsfiddle?   -  person Esailija    schedule 24.06.2012


Ответы (3)


arrow_upward
4
arrow_downward

1) Решение Bootstrap typeahead v2.0.2

взгляните на этот запрос на вытягивание, он похож на то, что вы ищете (его форк от bootstrap typeahead v2.0.2).

Сам пользуюсь, работает :)

2) Bootstrap typeahead v.2.1.0 — решение в стадии разработки

Также вы можете попробовать это решение. Я только что изменил свой проект, чтобы использовать этот, потому что он будет поддерживаться в будущих версиях и выглядит чище :)

В моем случае:

$("#typeahead").typeahead({
  source: function(query, process) {
    $.post('url_path', { q: query, limit: 4 }, function(data) {
      process(data);
    }); // end of post
  }
});

Где скрипт url_path требует 2 аргумента q (строка) и limit (ограничение результатов) и возвращает ответ json (массив):

Пример ответа на запрос i с ограничением 4:

["Эминем", "Limp Bizkit", "Рианна", "Уилл Смит"]

person ioleo    schedule 06.07.2012

arrow_upward
2
arrow_downward

Для людей, пытающихся сгенерировать данные JSON (без использования php json_encode) и задающихся вопросом, почему форк bootstrap-typeahead Терри Розен не будет работать при вызове ajax

Формат возвращаемых данных JSON должен иметь вид: -

[{"id":"1","name":"Старая машина"},{"id":"2","name":"Трамвай Кастро"},{"id":"3"," name":"Зеленые классические автомобили"},{"id":"4","name":"Автомобили, припаркованные в Antique Row"}]

Обратите внимание на кавычки

Проведя целый день, пытаясь понять, в чем проблема, я подумал, что было бы разумно опубликовать это здесь. Возможно, мое понимание JSON было неверным, но firebug показывает возвращаемые данные как действительный JSON, даже если поля id и name не заключены в кавычки. Кроме того, заголовок ответа должен иметь значение «application/json». Надеюсь, это поможет кому-то.

person Madhur    schedule 06.08.2012
comment
У меня были обе эти проблемы: старый формат JSON и заголовок ответа не были установлены в application/json, и этот ответ спас меня. - person ThisGuy; 11.05.2013

arrow_upward
1
arrow_downward

На версии 2.0.4 typeahead глючит и не принимает функции в качестве источника, только массивы. Я обновился до 2.1, и он работает, как и ожидалось.

person Yossi Shasho    schedule 26.08.2012