Блог

Вместо буквального сопоставления я бы хотел выбирать результаты с помощью регулярного выражения.

Могу ли я переопределить поведение автозаполнения по умолчанию для достижения этой цели или мне нужна альтернативная структура?

Для этого есть встроенный способ: просто укажите функцию для source опции в виджете автозаполнения:

 var items = ['Foo', 'Bar', 'Hello', 'Goodbye', '1234'];


$("#autocomplete").autocomplete({
    source: function(request, response) {
        // The term the user searched for;
        var term = request.term;

        // Extract matching items:
        var matches = $.grep(items, function(item, index) {
            // Build your regex here:
            return /d /.test(item);
        });

        // let autocomplete know the results:
        response(matches);
    }
});
  

http://jsfiddle.net/RSyrX/

Обратите внимание, что этот пример всегда будет возвращать «1234» из-за простого регулярного выражения, которое я использовал. Вероятно, более полезным было бы создать регулярное выражение на основе термина (также возможно).

На самом деле это очень похоже на то, как сам виджет фильтрует результаты. Проверьте эту строку для функции filter и эту строку, чтобы увидеть, как она вызывается, если вы предоставляете массив в качестве source опции.

Я создал пример, в котором отображаются только результаты, содержащие строку ‘jQuery’ в метке:

 var projects = [
    {
    value: "jquery",
    label: "jQuery",
    desc: "the write less, do more, JavaScript library",
    icon: "jquery_32x32.png"},
{
    value: "jquery-ui",
    label: "jQuery UI",
    desc: "the official user interface library for jQuery",
    icon: "jqueryui_32x32.png"},
{
    value: "sizzlejs",
    label: "Sizzle JS",
    desc: "a pure-JavaScript CSS selector engine",
    icon: "sizzlejs_32x32.png"}
];

$("input").autocomplete({
    source: projects
}).data("autocomplete")._renderItem = function(ul, item) {

    // this is where you can implement your regex
    if (item.label.indexOf("jQuery") !== -1) {
        return $("<li></li>").data("item.autocomplete", item).append("<a>"   item.label   "<br>"   item.desc   "</a>").appendTo(ul);
    }
};
  

Демонстрация здесь.

Да, вы можете переопределить поведение автозаполнения jQueryUI по умолчанию. В вашем контроллере вы должны написать логику на стороне сервера для генерации набора результатов. jQuery autcomplete по умолчанию использует q в качестве параметра. Используя который, вы можете получить значения и сгенерировать результирующий набор, который будет списком. Я думаю, это даст вам представление. Автозаполнение просто отображает результат для каждого ключевого элемента. Вы должны позаботиться о отображении логики