jquery Autcomplete, как я могу всегда отображать renderMenu независимо от того, есть ли исходные совпадения?

Question

Я хочу добавить помощника для автозаполнения jQuery следующим образом:

    var thing = $("#thing").autocomplete({
        minLength: 0,
        source: myarray
    })

    // Override the Render Menu
    thing.data("autocomplete")._renderMenu= function(ul, items) {
        var self = this;
        $.each( items, function( index, item ) {
            self._renderItem( ul, item );
        });
        // Adder
        ul.append( "<a class='helper'>Add <b>\"" + this.term + "\"</b> as a new item</a>")
    }

Проблема в том, что этот HELPER отображается только тогда, когда автозаполнение имеет хотя бы 1 совпадение поиска с myarray. Как сделать так, чтобы меню всегда отображалось, когда пользователь сфокусирован?

Спасибо

Answer 1

Я думаю, что еще немного исправлений в порядке:

/* Override the _response function to always open the suggestions menu: */
thing.data("autocomplete")._response = function(content) {        
    if (!this.options.disabled) {
        this._trigger("open");
        content = this._normalize(content);
        this._suggest(content);
    }

    this.pending--;
    if (!this.pending) {
        this.element.removeClass("ui-autocomplete-loading");
    }
};

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

Это должно сработать, но я продолжу искать решение с использованием стандартного API.

<ч />

Вот еще одно решение, которое не требует много операций на открытом сердце, но требует больше кода:

var thing = $("#thing").autocomplete({
    minLength: 0,
    /* Use a source function instead of the array */
    source: function(request, response) {
        var result = myArray.slice(0);
        /* Filter the array normally... */
        result = $.ui.autocomplete.filter(result, request.term);

        /* Add a placeholder result that we can process later */
        result.push({
            value: request.term,
            isPlaceholder: true
        });
        response(result);

    }
}).focus(function() {
    $(this).autocomplete("search", this.value);
});

var renderItem = thing.data("autocomplete")._renderItem;
/* Override the _renderItem function to display the placeholder item */
thing.data("autocomplete")._renderItem = function(ul, item) {
    if (item.isPlaceholder) {
        return $("<li>")
            .data("item.autocomplete", item)
            .append("<a class='helper'>Add <b>\"" + item.value + "\"</b> as a new item</a>")
            .appendTo(ul);

    } else {
        renderItem(ul, item);
    }
};

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

Я бы лично выбрал это решение, поскольку оно менее инвазивно.

Answer 2

Лучше было бы добавить элемент, относящийся к количеству предметов, которые вы получаете от бэкэнда.
Если это массив json, тогда добавьте объект json с меткой и специальным значением -1. В этом случае массив всегда будет содержать один объект. :)