How to block the ASP.NET page while ajax UpdateProgress is being displayed.
        Posted  
        
        on Microsoft .NET Support Team
        
        See other posts from Microsoft .NET Support Team
        
        
        
        Published on Tue, 29 Jun 2010 13:44:00 +0000
        Indexed on 
            2010/12/06
            16:58 UTC
        
        
        Read the original article
        Hit count: 500
        
AJAX
|.NET Tips and Tricks
Step 1:
Copy the following styles to your aspx page.
<style type="text/css">      
      .hide       
      {       
          display: none;       
      }       
      .show       
      {       
          display: inherit;       
      }       
       .progressBackgroundFilter       
      {       
          position: absolute;       
          top: 0px;       
          bottom: 0px;       
          left: 0px;       
          right: 0px;       
          overflow: hidden;       
          padding: 0;       
          margin: 0;       
          background-color: #000;       
          filter: alpha(opacity=50);       
          opacity: 0.5;       
          z-index: 1000;       
      }       
      .processMessage       
      {       
          position: absolute;       
          font-family:Verdana;       
          font-size:12px;       
          font-weight:normal;       
          color:#000066;       
          top: 30%;       
          left: 43%;       
          padding: 10px;       
          width: 18%;       
          z-index: 1001;       
          background-color: #fff;       
      }       
  </style>
Step 2: Put the divs as shown below in UpdateProgress control.
<asp:UpdateProgress ID="updPrgsBaselineTab" runat="server">      
       <ProgressTemplate>       
           <div id="progressBackgroundFilter" class="progressBackgroundFilter">       
           </div>       
           <div id="processMessage" class="processMessage">       
               <table width="100%">       
                   <tr style="width: 100%">       
                       <td style="width: 100%">       
                           Please Wait..........       
                       </td>       
                   </tr>       
                   <tr style="width: 100%">       
                       <td style="width: 100%" align="center">       
                           <img src="../Images/Update_Progress.gif" />       
                       </td>       
                   </tr>       
               </table>       
           </div>       
       </ProgressTemplate>       
   </asp:UpdateProgress>
© Microsoft .NET Support Team or respective owner