Jquery Autocomplete - нет сообщения о результате

Я бы хотел, чтобы автозаполнение отображало «нет результатов» в раскрывающемся списке, если результат не найден.

Моя ситуация похожа на пример JQuery по умолчанию.

$(function() {
    var availableTags = [
        "ActionScript",
        "AppleScript",
        "Asp",
        "BASIC",
        "C",
        "C++",
        "Clojure",
        "COBOL",
        "ColdFusion",
        "Erlang",
        "Fortran",
        "Groovy",
        "Haskell",
        "Java",
        "JavaScript",
        "Lisp",
        "Perl",
        "PHP",
        "Python",
        "Ruby",
        "Scala",
        "Scheme"
        ];
    $( "#tags" ).autocomplete({
        source: availableTags
    });
});

Спасибо за помощь.


html jquery jquery-ui jquery-ui-autocomplete
person m14Grl    schedule 29.12.2011    source источник
comment
возможный дубликат обнаружение отсутствия результатов при автозаполнении jQuery UI   -  person Andrew Whitaker    schedule 29.12.2011
comment
На самом деле, этот немного отличается от того, который я привел как дубликат. Пожалуйста, не обращайте внимания на мой близкий голос.   -  person Andrew Whitaker    schedule 29.12.2011

Ответы (2)


arrow_upward
10
arrow_downward

Вот один из способов сделать это:

$(function() {
    var availableTags = [ /* snip */];  
    var NoResultsLabel = "No Results";

    $("#tags").autocomplete({
        source: function(request, response) {
            var results = $.ui.autocomplete.filter(availableTags, request.term);

            if (!results.length) {
                results = [NoResultsLabel];
            }

            response(results);
        },
        select: function (event, ui) {
            if (ui.item.label === NoResultsLabel) {
                event.preventDefault();
            }
        },
        focus: function (event, ui) {
            if (ui.item.label === NoResultsLabel) {
                event.preventDefault();
            }
        }
    });
});

По сути, вам нужно предоставить ссылку на функцию как source для автозаполнения. Внутри этой функции вы можете использовать ту же служебную функцию ($.ui.autocomplete.filter) для фильтрации результатов. Затем вы можете увидеть, пуст ли массив результатов. Если это так, вы можете добавить сообщение по умолчанию в список результатов.

Два других параметра, которые я указал, предотвращают выбор или фокусировку параметра Нет результатов.

Пример: http://jsfiddle.net/er6LF/

person Andrew Whitaker    schedule 29.12.2011
comment
Идеально! Спасибо, Андрей. Теперь я могу идти домой. - person m14Grl; 29.12.2011

arrow_upward
0
arrow_downward

У этой скрипки есть рабочий пример: http://jsfiddle.net/andrewodri/wAg4g/

Я изменил это:

$("#tags").autocomplete({source: availableTags});

К этому:

$("#tags").autocomplete(availableTags);

Вы можете видеть, что он работает на последней версии jQuery, а подключаемый модуль связан в разделе «Управление ресурсами», взятом из: http://bassistance.de/jquery-plugins/jquery-plugin-autocomplete/.

Обновление: приведенный выше код работает, если вы используете указанный плагин... Если нет, похоже, он работает как есть :) Обратите внимание, что я добавил код в $(document).ready();, который мог мешает, если от работы. См. эту разветвленную скрипту: http://jsfiddle.net/andrewodri/VLKwe/

Надеюсь, это поможет!

person Andrew Odri    schedule 29.12.2011
comment
Кстати, дополнительная документация по этому плагину доступна здесь: docs.jquery.com/Plugins/Autocomplete. - person Andrew Odri; 29.12.2011
comment
ОП не использует этот плагин, он использует автозаполнение jQueryUI (jqueryui.com/demos/autocomplete< /а>) - person Andrew Whitaker; 29.12.2011
comment
Ах, мой плохой! Проверьте эту разветвленную скрипку: jsfiddle.net/andrewodri/VLKwe. Пост обновлен :) - person Andrew Odri; 29.12.2011