Je bosse quasiment à 100% avec jQuery, pour, entre autre, la richesse des plugins existants, richesse évitant de réinventer la roue sans cesse.
Et l'un de mes plugins clef c'est le ajax autocomplete de chez DEVBRIDGE, accessible sur leur site.
Mais ce plugin, à mon gout, avait 1 défaut : lorsque la requête ajax est lancée, aucun signal visuel n'est émis pour signaler à l'utilisateur que "ca mouline".
Grave erreur/handicap en matière d'expérience utilisateur.J'ai donc modifié un peu le plugin, en lui ajoutant une option : loaderImg.
Cette option correspond simplement à l'url de votre gif animé (par exemple), et ce dernier sera injecté en background dans votre champ, pour ensuite disparaitre une fois la requête finie.
Voici donc un exemple d'initialisation du plugin avec l'option loaderImg:
var options, a;
jQuery(function(){
options = {
serviceUrl:'service/autocomplete.ashx',
loaderImg:'/images/ajax-loader.gif'
};
a = $('#query').autocomplete(options);
});
Si aucune valeur n'est spécifiée pour cette option, le plugin cherchera à charger "loader.gif".
Je vous invite à consulter la documentation sur le site de devbridge pour consulter le détail des options disponibles.
J'améliorerai peut être la chose avec plus d'options (par exemple, pour l'instant, l'image est injectée en fond du champ input concerné en haut a droite, mais on pourrait par exemple proposer une option pour justement modifier l'endroit où est injecté ce 'signal' visuel).
Voici donc une archive zip contenant le code source, sa version compressée, une feuille de style, et jQuery 1.3.2.
J'ai pompeusement flaggé ce fichier 1.1. 3 , parce qu'a mon gout, évolution mineure, mais évolution quand même.
jquery.autocomplete-1.1.3 Testé sous IE6/7/FF 3.6.2