Добавление элемента в автозаполнение пользовательского интерфейса jQuery - PullRequest
Новая
       3

Добавление элемента в автозаполнение пользовательского интерфейса jQuery

8 голосов
/ 18 апреля 2011

В настоящее время я использую автозаполнение пользовательского интерфейса jQuery для текстового поля, которое ссылается на файл ASHX.

Все работает правильно, за исключением того, что я хочу добавить элемент в конец списка, который гласит: «Элемент не найден? Нажмите здесь, чтобы запросить добавление нового элемента».

Я попробовал следующие строки кода, но все, что он сделал, это отформатировал элемент, я не смог добавить. 

data( "catcomplete" )._renderItem = function( ul, item ) {
        return $( "<li></li>" )
            .data( "item.catcomplete", item )
            .append( $( "<a class='ui-menu-item'></a>" ).text( item.label ) )
            .appendTo( $('ul').last('.autocomplete-category'));
    };

Советы? Подсказки? Mucho Gracias! : D

Ответы [ 2 ]

9 голосов
/ 18 апреля 2011

Вы должны добавить дополнительную запись после события Open . Это даст вам доступ к списку, который вам нужен, а не к каждому элементу, к которому _renderItem предоставляет вам доступ.

Вот пример стилизации записей, которые были заполнены в списке: 

$("#myBox").autocomplete({
        source: "[URL]",
        minLength: 2,
        open: function(event, ui) {
            $("ul.ui-autocomplete.ui-menu .ui-menu-item:odd").css("background-color","#dedede");
        }
    });
1 голос
/ 18 апреля 2011

Вы не хотите возиться с _renderItem.Это фн, который отображает один элемент;он вызывается один раз для каждого элемента в списке предложений.

То, что вы хотите сделать, это monkeypatch функция _renderMenu.Исходное определение в jQuery UI 1.8.6 выглядит следующим образом: 

_renderMenu: function( ul, items ) {
    var self = this;
    $.each( items, function( index, item ) {
        self._renderItem( ul, item );
    });
},

Это, вероятно, в основном то же самое для других версий jQuery UI.

Установите этот флажок, чтобы добавить дополнительный элемент после выполнения операции $.each.

...