0

I am using ASP.NET 2.0 and AJAX extension tool.

I already created loading indicator on button submit. When I will click the button, the loading indicator will show after redirecting to the next page. But, I want to hide the page until processing has completed (after that redirect to next page).

I am using the following code:

 <td style="width: 100px; height: 26px;">
                  <asp:ScriptManager ID="ScriptManager1" runat="server">
                </asp:ScriptManager> 
                <asp:UpdateProgress ID="UpdateProgress1" DynamicLayout="false" runat="server">
    <ProgressTemplate>
    <img src="Images/loading.gif" alt="Images/loading.gif" style="z-index: 100; left: 21px; position: absolute; top: 64px" />

    </ProgressTemplate>
    </asp:UpdateProgress>
                 <asp:UpdatePanel ID="UpdatePanel1" runat="server">
                    <ContentTemplate>
                    <dx:ASPxButton ID="btnOk" ClientInstanceName="btnok" runat="server" Style="z-index: 100; left: 90px; position: absolute;
                    top: 108px" Text="OK" Width="61px" BackColor="Gainsboro" OnClick="btnOk_Click" AutoPostBack="False" >
                    <DisabledStyle>
                        <Border BorderColor="Teal" />
                    </DisabledStyle>
                        <ClientSideEvents Click="function(s, e) {
                    ShowloadingImage();
                        }" />


                </dx:ASPxButton>
               </ContentTemplate>
            </asp:UpdatePanel>  
1
  • So you want a 'loading' image to redirect from the current page? Or are you performing some complex interaction server-side that should redirect once it has processed? Feb 29, 2012 at 12:52

2 Answers 2

1

To "hide" your page you can make an overlay div over all, using this css

.OverAll
{
   height:100%;
   width:100%;
   position:fixed;
   left:0;
   top:0;
   z-index:2 !important;
   background-color:black;
}
0

using jquery we can hide the page on page loading...I am using following code

       $(function() { 
    ($.unblockUI);   
    $('#pnlLogin_btnOk').click(function() {
        $.blockUI({ message: '<img src="Images/loading.gif" />' });
    });
});

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.