jquery ui autocomplete : comment garder la liste de sélection ouverte jusqu'à ce qu'une sélection ait été faite ?

Question

Je veux forcer un utilisateur à sélectionner quelque chose dans la liste déroulante de l'interface autocomplete de jquery. J'ai essayé de renvoyer false dans une fonction utilisant l'événement "close", mais cela ne fonctionne pas. Comment puis-je garder la liste de sélection ouverte jusqu'à ce que l'utilisateur fasse une sélection ?

Pour ceux qui ont besoin de le voir, http://smartsend.ontech.com.au/quote Tapez le code postal de quatre - Je veux garder cette liste ouverte.

Gracias

Jason

Answer 1

L'ajout d'un gestionnaire personnalisé pour l'événement de fermeture, qui rouvre les résultats, fonctionne, mais est un peu ennuyeux parce que les résultats ne peuvent jamais être fermés. Je voulais que les résultats restent ouverts après que l'utilisateur a effectué une sélection, afin qu'il puisse en sélectionner d'autres, mais qu'ils se ferment si l'utilisateur n'effectue pas de sélection et clique ailleurs, ou si l'utilisateur appuie sur la touche d'échappement, ou supprime le texte saisi, ou fait toute autre chose qui fermerait normalement les résultats. Voici ce qui a fonctionné pour moi :

close : function (event, ui) {
    event.preventDefault();

    if ( event.which == 1 ) {
        $("ul.ui-autocomplete").show();
        $("ul.ui-autocomplete").data('keep-open', 1);
    }
    else if ( $("ul.ui-autocomplete").data('keep-open') == 1) {
        $("ul.ui-autocomplete").show();
        $("ul.ui-autocomplete").data('keep-open', 0);
    }

    return false;
}

L'événement.which est 1 lorsque l'utilisateur fait une sélection, cependant, un autre événement close suivrait immédiatement et fermerait les résultats de toute façon. J'ai donc ajouté le drapeau "keep-open". Il existe peut-être une meilleure façon de gérer cette complication.

J'ai également ajouté un bouton de fermeture simple pour que l'utilisateur puisse fermer manuellement les résultats lorsqu'il a terminé sa sélection.

Answer 2

Je n'ai pas trouvé de moyen de le faire, j'ai donc utilisé le plugin block UI