If you have a page where you want to disable all the control while some server side processing is going on, you might want to display the update progress for an updatepanel as a modal popup. You can do that by adding the below code in your update progress.
<asp:UpdateProgress ID="UpdateProgress1" runat="server" AssociatedUpdatePanelID="updatePanel1"DisplayAfter="0">
<ProgressTemplate>
<div style="background-color: Gray; filter: alpha(opacity=60); opacity: 0.60; width: 100%;top: 0px; left: 0px; position: fixed; height: 100%;">
</div>
<div style="margin: auto; font-family: Trebuchet MS; filter: alpha(opacity=100);opacity: 1; font-size: small; vertical-align: middle; top: 45%; position: fixed;right: 45%; color: #275721; text-align: center; background-color: White; height: 100px;">
<table style="background-color: White; font-family: Sans-Serif; text-align: center;border: solid 1px #275721; color: #275721; width: inherit; height: inherit; padding: 15px;">
<tr>
<td style="text-align: inherit;">
<img src="../../Images/loading.gif" alt="Loading" />
</td>
<td style="text-align: inherit;">
<span style="font-family: Sans-Serif; font-size: medium; font-weight: bold; font">
Please Wait...</span>
</td>
</tr>
</table>
</div>
</ProgressTemplate>
</asp:UpdateProgress>
<asp:UpdateProgress ID="UpdateProgress1" runat="server" AssociatedUpdatePanelID="updatePanel1"DisplayAfter="0">
<ProgressTemplate>
<div style="background-color: Gray; filter: alpha(opacity=60); opacity: 0.60; width: 100%;top: 0px; left: 0px; position: fixed; height: 100%;">
</div>
<div style="margin: auto; font-family: Trebuchet MS; filter: alpha(opacity=100);opacity: 1; font-size: small; vertical-align: middle; top: 45%; position: fixed;right: 45%; color: #275721; text-align: center; background-color: White; height: 100px;">
<table style="background-color: White; font-family: Sans-Serif; text-align: center;border: solid 1px #275721; color: #275721; width: inherit; height: inherit; padding: 15px;">
<tr>
<td style="text-align: inherit;">
<img src="../../Images/loading.gif" alt="Loading" />
</td>
<td style="text-align: inherit;">
<span style="font-family: Sans-Serif; font-size: medium; font-weight: bold; font">
Please Wait...</span>
</td>
</tr>
</table>
</div>
</ProgressTemplate>
</asp:UpdateProgress>
No comments:
Post a Comment