Je voudrais que l’auto-complétion affiche “aucun résultat” dans sa liste déroulante si aucun résultat n’est trouvé
Ma situation ressemble à l’exemple par défaut de JQuery.
$(function() { var availableTags = [ "ActionScript", "AppleScript", "Asp", "BASIC", "C", "C++", "Clojure", "COBOL", "ColdFusion", "Erlang", "Fortran", "Groovy", "Haskell", "Java", "JavaScript", "Lisp", "Perl", "PHP", "Python", "Ruby", "Scala", "Scheme" ]; $( "#tags" ).autocomplete({ source: availableTags }); });
Merci de votre aide.
Voici une façon d’accomplir ceci:
$(function() { var availableTags = [ /* snip */]; var NoResultsLabel = "No Results"; $("#tags").autocomplete({ source: function(request, response) { var results = $.ui.autocomplete.filter(availableTags, request.term); if (!results.length) { results = [NoResultsLabel]; } response(results); }, select: function (event, ui) { if (ui.item.label === NoResultsLabel) { event.preventDefault(); } }, focus: function (event, ui) { if (ui.item.label === NoResultsLabel) { event.preventDefault(); } } }); });
Fondamentalement, vous devez fournir une référence de fonction en tant que source
de la saisie semi-automatique. À l’intérieur de cette fonction, vous pouvez utiliser la même fonction utilitaire ( $.ui.autocomplete.filter
) pour filtrer les résultats. Ensuite, vous pouvez voir si le tableau de résultats est vide. Si c’est le cas, vous pouvez append un message par défaut à la liste des résultats.
Les deux autres options que j’ai spécifiées empêchent la sélection ou la focalisation de l’option Aucun résultat .
Exemple: http://jsfiddle.net/er6LF/
Ce violon a un travail est un exemple fonctionnel pour vous avez: http://jsfiddle.net/andrewodri/wAg4g/
J’ai changé ceci:
$("#tags").autocomplete({source: availableTags});
Pour ça:
$("#tags").autocomplete(availableTags);
Vous pouvez voir qu’il fonctionne sur la dernière version de jQuery et que le plug-in est lié à “Manage Resources” à partir de: http://bassistance.de/jquery-plugins/jquery-plugin-autocomplete/ .
Mise à jour: Le code ci-dessus fonctionne si vous utilisez le plug-in référencé … Sinon, il semble fonctionner tel quel 🙂 Veuillez noter que j’ai ajouté le code dans $(document).ready();
, qui peut avoir empêché si de travailler. S’il vous plaît voir ce violon fourchu: http://jsfiddle.net/andrewodri/VLKwe/
J’espère que cela pourra aider!