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
2011/01/11
9:57 UTC
Read the original article
Hit count: 275
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