jQuery autocomplete: How to show an animated gif loading image

63,727

If no results isn't works you can do this:

$("input[name='search']").autocomplete({
...,
select: function( event, ui ) {
action show image
}   
}).data( "autocomplete" )._renderItem = function( ul, item ) {
action hide image
}
Share:
63,727
Daniel Peñalba
Author by

Daniel Peñalba

Software Engineer at Unity Technologies, Valladolid, Spain. Currently developing gmaster, Plastic SCM and SemanticMerge. Areas: C# GUI development Winforms and WPF expert ASP .NET Core Multiplatform UI development with Mono (Linux and OSX, GTK# and MonoMac) Eclipse plugin, Java Automated testing, NUnit, Moq, PNUnit and TestComplete Email: dpenalba[AT]codicesoftware[DOT]com I play the guitar at Sharon Bates, the greatest Spanish rock band.

Updated on July 09, 2022

Comments

  • Daniel Peñalba
    Daniel Peñalba almost 2 years

    I'm using the jQuery AutoComplete plugin combined with ajax. Do you know how can I show a progress indicator while the ajax search is performed?

    This is my current code.

    <script type="text/javascript">
        $("#autocomplete-textbox").autocomplete('http://www.example.com/AutoComplete/FindUsers');
    </script>
    
    <div>
        <input type="text" id="autocomplete-textbox" />
        <span class="autocomplete-animation"><img id="ajaxanimation" src="../img/indicator.gif")"/></span>
    </div>
    

    The FindUsers URL returns a user list in the content.