Click here to Skip to main content
65,938 articles
CodeProject is changing. Read more.
Articles / database / SQL-Server / SQL-Server-2008R2

Progress Bar

3.40/5 (2 votes)
8 May 2014CPOL 13.2K  
Regarding progress bar

Introduction

This tip tells you about progress bar at the time of post back so that the user can't perform the action during critical action performed like credit card payment, saving the data to database, etc. Here, I have code for that.

ASP.NET
<asp:UpdateProgress DisplayAfter="1" 
ID="upProgress" DynamicLayout="true" runat="Server"
        AssociatedUpdatePanelID="upPay" >
        <ProgressTemplate>
            
            <img id="Img1" src="~/images/ajax-loader.gif" 
            runat="server" visible="true" alt="jrc" /><br />
            
            <div style="width:40%;">
                <asp:Label ID="lblwarningmsg"  ForeColor="Red" 
                text="Please wait while the transaction is processed and do not click the 
                "back button" or refresh  or close the browser window." runat="server">
                </asp:Label>
            </div>

        </ProgressTemplate>
       
    </asp:UpdateProgress>

Also add this script for display progress bar center of the page:

JavaScript
<script language="JavaScript" type="text/javascript">
       function adjustDivs() {
           var df = document.getElementById('<%=upProgress.ClientID %>');
           df.style.position = 'absolute';
           df.style.left = (document.documentElement.scrollLeft + 45) + '%';
           df.style.top = (document.documentElement.scrollTop + 300) + 'px';
       }
       adjustDivs();
       window.onload = adjustDivs;
       window.onresize = adjustDivs;
       window.onscroll = adjustDivs;
   </script>

License

This article, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)