jQueryUI autocomplete doesn’t provide native method how to show progress indicator, while your suggestion list is generated.
I managed it to do in the following way:
1. I got a suitable progress indicator from http://www.ajaxload.info/ and placed it to /img/
2. define input field for using in autocomplete method
3. create style for displaying progress indicator right in our input field
input.wait { background: url(/img/ajax-loader.gif) no-repeat top right; }
4. and at last define autocomplete method
$("input#sugest").autocomplete({ search: function(event, ui) { $(this).addClass("wait"); }, open: function(event, ui) { $(this).removeClass("wait"); }, source: "remote_source.php", minLength: 2, select: function(event, ui) { //some action on select } });
Thanks a lot, that’s pretty cool, you helped me=)
Actually, jquery-ui adds a class to the input textbox while loading. You just need to declare your css for it.
like:
.ui-autocomplete-loading {
background: white url(‘/img/ajax-loader.gif’) right center no-repeat;
}
Which css i hav to declare that..is it the jquery ui.css you mean?..if so it is not working for me..do i hav to make any changes..
what exactly doesn’t work in your case?