Comment ajouter un message d'aide à la fin de jquery Autocomplete ?

Question

J'utilise l'autocomplétion jQuery pour un champ de recherche. Lorsque la source de l'autocomplétion renvoie une réponse de 0 résultat, l'autocomplétion semble cassée. Comment puis-je toujours ajouter un message d'aide en bas de l'autocomplétion.

J'aimerais que le message d'aide apparaisse au moment de la mise au point, et chaque fois qu'il y a 0 ou plus de résultats. Voici ce que j'ai jusqu'à présent :

        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 );
        };
    }

Comment puis-je avoir toujours un LI comme celui-ci dans l'autocomplétion :

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

Merci

Answer 1

Vous pouvez probablement faire un petit hack dans votre source comme ceci :

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 );
                    }
                });
            }

J'ai récemment manipulé le code source de la saisie semi-automatique et j'ai trouvé qu'il était clair et facile de personnaliser et de modifier son comportement, c'est donc une alternative.