Aspdotnet-Suresh

aspdotnet-suresh offers C#.net articles and tutorials,csharp dot net,asp.net articles and tutorials,VB.NET Articles,Gridview articles,code examples of asp.net 2.0 /3.5,AJAX,SQL Server Articles,examples of .net technologies

jQuery Show / Hide Loading Image in Autocomplete Textbox

Sep 11, 2013
Introduction:

Here I will explain how to show or hide loading image in
jQuery autocomplete textbox.
Description:
  
In previous posts I explained jQuery show loading image while page loads, jQuery autocomplete textbox with webservice, jQuery autocomplete textbox with multiple words with commas, jQuery autocomplete textbox with images and many articles relating to
JQuery, asp.net, JavaScript. Now I will explain how to show or hide loading image in jQuery autocomplete textbox.
To show or hide loading image in autocomplete textbox we can follow different approaches

Method 1

Best method is to add ui-autocomplete-loading css class to show or hide loading image in jQuery autocomplete textbox while searching like as shown below

ui-autocomplete-loading { background:url('img/loading.gif') no-repeat right center }

Method 2
To show or hide loading image in jQuery autocomplete textbox we can follow another method like as shown below

search: function() { $('#smallimgload').show(); },
open: function() { $('#smallimgload').hide(); },
Complete function will be like as shown below

$('#othersubcat').autocomplete({
source: function(request, response) {
$.ajax({
url: 'AutoComplete.ashx',
dataType: "json",
data: { term: request.term },
success: function(data) {
response(data.d);
}
});
},
search: function() { $('#smallimgload').show(); },
open: function() { $('#smallimgload').hide(); }
});

If you enjoyed this post, please support the blog below. It's FREE!

Get the latest Asp.net, C#.net, VB.NET, jQuery, Plugins & Code Snippets for FREE by subscribing to our Facebook, Twitter, RSS feed, or by email.

subscribe by rss Subscribe by RSS subscribe by email Subscribe by Email

2 comments :

Anonymous said...

Good 1

Anonymous said...

But how to hide when nothing is in autocomplete list? It's visble when no list in dropdown

Give your Valuable Comments

Note: Only a member of this blog may post a comment.

© 2015 Aspdotnet-Suresh.com. All Rights Reserved.
The content is copyrighted to Suresh Dasari and may not be reproduced on other websites without permission from the owner.