Обновление контроля выполнения, не показывающего изображение с помощью события TextChanged

Question

Я хочу показать Загрузка изображения в то время как TextChanged Событие, потому что я заполняю gridview, пока TextChanged Изменение события. Я пытаюсь, но изображение не отображается.

Ниже мой дизайн код:

<asp:Panel ID="pnl_Candidate" runat="server" Visible="false"> 
    <asp:UpdatePanel ID="UpdatePanel1" runat="server"> 
     <ContentTemplate> 
      <asp:TextBox ID="txt_CandidateSource" runat="server" OnTextChanged="txt_CandidateSource_TextChanged" AutoPostBack="True" class="form-control input-sm" placeholder="Candidate Source" Width="30%" /> 

     <asp:GridView ID="GridView1" runat="server" CssClass="footable" Style="max-width: 500px" AutoGenerateColumns="False" OnPageIndexChanging="GridView1_PageIndexChanging" AllowPaging="true" PageSize="5" DataKeyNames="EMail" > 
      <Columns> 
       <asp:TemplateField HeaderText="Sno"> 
       <ItemTemplate> 
       <%# Container.DataItemIndex + 1 %> 
       </ItemTemplate> 

       </asp:TemplateField> 
       <asp:BoundField DataField="CandidateSource" HeaderText="CandidateSource"></asp:BoundField> 
      <asp:BoundField DataField="Name" HeaderText="Name"></asp:BoundField> 
       <asp:BoundField DataField="Gender" HeaderText="Gender"></asp:BoundField> 
       <asp:BoundField DataField="DOB" HeaderText="DOB"></asp:BoundField> 
       <asp:BoundField DataField="Mobile" HeaderText="Mobile"></asp:BoundField> 
      <asp:BoundField DataField="EMail" HeaderText="EMail"></asp:BoundField> 
      <asp:BoundField DataField="Qualification" HeaderText="Qualification"></asp:BoundField> 
      <asp:BoundField DataField="CurrentLocation" HeaderText="CurrentLocation"></asp:BoundField> 
      <asp:BoundField DataField="TotalExperience" HeaderText="TotalExperience"></asp:BoundField> 
      <asp:BoundField DataField="CurrentCompany" HeaderText="CurrentCompany"></asp:BoundField> 
      <asp:BoundField DataField="Designation" HeaderText="Designation"></asp:BoundField> 
      <asp:BoundField DataField="WorkLocation" HeaderText="WorkLocation"></asp:BoundField> 

      <asp:TemplateField HeaderText="add Comment Status"> 
      <ItemTemplate> 
      <asp:LinkButton ID="lnkbtn_Comment_Status" runat="server" 
            Text="Comment" OnClick="lnkbtn_Comment_Status_Click"></asp:LinkButton> 
     </ItemTemplate> 
      </asp:TemplateField> 
     </Columns> 
      <PagerStyle CssClass="pgr" /> 
      <EmptyDataTemplate> 
      <center> 
      <asp:Label ID="Label2" CssClass="Helptext_red" runat="server" Text="No Candidate Available"></asp:Label> 
      </center> 
      </EmptyDataTemplate> 
      <HeaderStyle CssClass="header" /> 
      <AlternatingRowStyle CssClass="alt" /> 
      </asp:GridView> 

      </ContentTemplate> 
     </asp:UpdatePanel> 
     <asp:UpdateProgress ID="UpdateProgress2" DisplayAfter="0" runat="server" AssociatedUpdatePanelID="UpdatePanel1"> 
      <ProgressTemplate> 
       <div class="modal"> 
        <div class="center"> 
         <img alt="" src="loading_bar_animated.gif" /> 
        </div> 
       </div> 
      </ProgressTemplate> 
     </asp:UpdateProgress> 

Мой TextChange событий и Filling GridView в каждом случае изменения текста:

protected void txt_CandidateSource_TextChanged(object sender, EventArgs e) 
{ 
    if (txt_CandidateSource.Text != "") 
    { 
     System.Threading.Thread.Sleep(2000); 
     DataTable dt = new DataTable(); 
     bo.Para1 = txt_CandidateSource.Text; 
     bo.Para2 = txt_Qualification.Text; 
     bo.Para3 = txt_CurrentLocation.Text; 
     bo.Para4 = txt_TotalExperience.Text; 
     bo.Para5 = txt_Designation.Text; 
     dt = bl.Search_CandidateMaster(bo); 
     GridView1.DataSource = dt; 
     GridView1.DataBind(); 
    } 
} 

Answer 1

использование этого UpdateProgress тонкая работа

CSS:

<style type="text/css"> 
     .rcs { 
      display: block; 
      position: absolute; 
      top: 40%; 
      left: 45%; 
     } 
</style> 

ASPX:

  <asp:UpdateProgress ID="UpdateProgress1" runat="server" DisplayAfter="1" DynamicLayout="true"> 
       <ProgressTemplate> 
        <asp:Panel ID="Panel1543633" runat="server" Style="width: 100%; height: 100%; position: fixed; left: 0; top: 0; z-index: 99999; background: rgba(0, 0, 0, 0.2);"> 
         <div class="rcs"> 
          <asp:Image ID="Image1" ImageUrl="~/images/loading.gif" AlternateText="Processing" 
           runat="server" /> 
         </div> 
        </asp:Panel> 
       </ProgressTemplate> 
      </asp:UpdateProgress>