Как добавить вспомогательное сообщение в конец jquery Autocomplete - PullRequest
Новая
       34

Как добавить вспомогательное сообщение в конец jquery Autocomplete

2 голосов
/ 15 февраля 2012

Я использую автозаполнение jQuery для поля поиска. Когда источник автозаполнения возвращает ответ 0 результатов, автозаполнение чувствует себя сломанным. Как я всегда могу добавить вспомогательное сообщение внизу автозаполнения.

Мне бы хотелось, чтобы вспомогательное сообщение появлялось в фокусе, и в любое время получалось 0 или более результатов. Вот что у меня пока так: 

        var me = this,
            cache = {}, // Autocomplete Caching (not built into jQuery UI by default)
            lastXhr,
            ac_div = $("#header-search-q");

        ac_div.autocomplete({
            appendTo: "#header-search",
            source: function(request, response) {
                var term = request.term.toLowerCase();
                if ( term in cache ) {
                    response( cache[ term ] );
                    return;
                }
                lastXhr = $.getJSON( "/users/search", _(request).extend({'q_type':'all'}), function( data, status, xhr ) {
                    cache[ term ] = data.users;
                    if ( xhr === lastXhr ) {
                        response( data.users );
                    }
                });
            }
        })
        .data( "autocomplete" )._renderItem = function( ul, item ) {        
            return $('<li></li>')
            .data( "item.autocomplete", item )
            .append( "<a>" + item.label + "</a>")
            .appendTo( ul );
        };
    }

Как я могу всегда иметь LI, как это в автозаполнении: 

<li class="helper">Can't find them?</a>

Спасибо

1 Ответ

1 голос
/ 15 февраля 2012

Вы, вероятно, можете сделать небольшой хак в вашей функции source, например: 

source: function(request, response) {
                var term = request.term.toLowerCase();
                if ( term in cache ) {
                    response( cache[ term ] );
                    return;
                }
                lastXhr = $.getJSON( "/users/search", _(request).extend({'q_type':'all'}), function( data, status, xhr ) {
                    cache[ term ] = data.users;
                    if ( xhr === lastXhr ) {
                        /* Hack follows: */
                        if(!data.users.length) data.users.push("Can't find them?");
                        response( data.users );
                    }
                });
            }

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

...