How to show progress bar in ASP.Net ?
In this article, I have explained about how to show progress bar in web page during process run-time using ASP.Net. This sample program I have used AJAX control toolkit for show progress bar. This progress bar is help to show user understand the process still in progress.
Description:
For example during the file upload time we can use progress bar to show for intimate the user the file is uploading. Like this here I used code how to shoe progress bar.
Java script code:Below java script code is used to show/hide pop up window.
<script language="javascript" type="text/javascript">
function ShowModalPopup(ModalBehaviour)
{
$find(ModalBehaviour).show();
}
function HideModalPopup(ModalBehaviour)
{
$find(ModalBehaviour).hide();
}
</script>
CSS code:During progress window open time set the back ground color of parent window using below css code
<style type="text/css">
.modalBackground
{
background-color: Gray;
filter: alpha(opacity=70);
opacity: 0.7;
}
.modalPopup
{
background-color: #ffffff;
padding: 3px;
width: 200px;
height: auto;
}
</style>
Below code is used to show pop up progress bar
<ajaxToolkit:ModalPopupExtender runat="server" PopupControlID="PanLoad" ID="ModalProgress" TargetControlID="PanLoad" BackgroundCssClass="modalBackground" BehaviorID="pload">
</ajaxToolkit:ModalPopupExtender>
<asp:Panel ID="PanLoad" runat="server" CssClass="modalPopup">
<asp:UpdatePanel ID="UpdatePanel2" runat="server">
<ContentTemplate>
<asp:UpdateProgress ID="UpdateProgress1" runat="server" DisplayAfter="0">
<ProgressTemplate>
<div align="center"><br />
<img src="images/load.gif" alt="loading" title="loading" />
Processing ... <br />
</div>
</ProgressTemplate>
</asp:UpdateProgress>
</ContentTemplate>
</asp:UpdatePanel>
</asp:Panel>
Source Code Detail:
Here with my attached source code with progress images and its AJAX tool kit download it and try to show progress bar in your ASP.Net website.
Front End : ASP.NET
Code Behind : C#
Conclusion:
I hope that my article help to beginner for show progress bar.
Thanks for the solution! it really made my day.But how does this solve the problem and why such issues are not mentioned in the places like read me files etc.??