Sunday, February 13, 2011

AutoCompleteExtender with Progress Image

0 comments 2/13/2011
Sign up to receive our site updates!
In last article i discussed about how to use AutoCompleteExtender,Now i am going to show here how to show progress image while retrieving results from DataBase,It is more use full if the DataBase Contains large no of records.





» Now create a website » Add TextBox » Add AutoCompleteExtender ass follows..

 <asp:TextBox ID="txtCity" runat="server">asp:TextBox><img id="loading" style="visibility:hidden" src="ajaxloader-thumb.gif" />
         <ac:AutoCompleteExtender ID="AutoCompleteExtender1" EnableCaching="true"
       BehaviorID="AutoCompleteEx" TargetControlID="txtCity"
       ServiceMethod="GetCities" MinimumPrefixLength="1"  
        onclientpopulating="ShowIcon"
        OnClientPopulated="ShowIcon"
       CompletionSetCount="10"                 CompletionListItemCssClass="autocomplete_completionListElement"        CompletionListHighlightedItemCssClass="autocomplete_highlightedListItem"
        CompletionListCssClass="autocomplete_listItem"
       runat="server" FirstRowSelected="true" >
       <ac:AutoCompleteExtender>

» onclientpopulating="ShowIcon" this make progress image visible

» onclientpopulated="ShowIcon" this make progress image hide

» Now add the flowing JavaScript in Head section

<script type="text/javascript">
function ShowIcon() {

    var e = document.getElementById("loading");

    e.style.visibility =  (e.style.visibility == 'visible') ? 'hidden' : 'visible';
}          

<script>

» If your DataBase contains less no records then you can't able to see the effect of the progress image for this just add the following line..

System.Threading.Thread.Sleep(3000);

See the last article to understand completely How To Use Ajax AutoCompleteExtender in Asp.Net

happy coding
Your Ad Here

0 comments:

Respects for your's Questions & Opinions

  • Friends
  •  

    Recent Posts

    New Comments

    Copyright 2008 All Rights Reserved Tech Tasks Template by Rajesh Kumar Chekuri