Progress bar using Ajax

1. Add Scipt manager
    <asp:ScriptManager ID="ScriptManager1" runat="server">
    </asp:ScriptManager>

2.Add update panel and add ajax progress in it and file upload control in it
 <asp:UpdatePanel ID="UpdatePanel1" runat="server">
  <ContentTemplate>
<table width="100%" border="0" cellspacing="0" cellpadding="0">
                    <tr>
                                    <td class="middleFormField2">
                                        <asp:Label ID="lblNew" Text="Upload New Dictation:" runat="server"></asp:Label>
                                        <asp:Label ID="lblUpdate" Text="File Name:" runat="server"></asp:Label><strong><font
                                            color="#FF0000">*</font></strong>
                                    </td>
                                    <td align="left" class="middleFormField2">
                                        <table>
                                            <tr>
                                                <td valign="top">
                                                    <asp:UpdateProgress ID="UpdateProgress2" AssociatedUpdatePanelID="UpdatePanel1" runat="server">
                                                        <ProgressTemplate>
                                                            <div style="visibility: hidden" id="progressBarDiv">
                                                                <font style="color: #000000" color="#336633" size="2"></font>
                                                                <img src="images/preloader.gif" />
                                                            </div>
                                                        </ProgressTemplate>
                                                    </asp:UpdateProgress>
                                                </td>
                                                <td>
                                                    <asp:FileUpload ID="txtUploadDictation" runat="server" Font-Names="verdana" Font-Size="Small" />
                                                    <asp:RequiredFieldValidator ID="txtUploadDictation_validate" runat="server" ControlToValidate="txtUploadDictation"
                                                        Display="None" ErrorMessage="You have not uploaded a file for dictation. Please upload a file to proceed"
                                                        SetFocusOnError="true" ValidationGroup="client" />
                                                    <asp:Label ID="lblFileName" runat="server" Font-Bold="true" Text=""></asp:Label>
                                                    <div style="visibility: hidden" id="progressBarDivText">
                                                        <font style="color: Purple" size="1">Processing, Please Wait...</font>
                                                    </div>
                                                </td>
                                            </tr>
                                        </table>
                                    </td>
                                </tr>
<tr>
                                    <td colspan="2" valign="top" class="middleFormField">
                                        <div align="center">
                                            <asp:ImageButton ID="submitButton" runat="server" ImageUrl="images/submitDictationBtn.gif"
                                                CausesValidation="true" Width="137" Height="20" border="0" OnClick="submitButton_Click"
                                                OnClientClick="javascript:showWait();" ValidationGroup="client" />
                                        </div>
                                    </td>
                                </tr>
</table>
</ContentTemplate>
 <Triggers>
                <asp:PostBackTrigger ControlID="submitButton"></asp:PostBackTrigger>
            </Triggers>
        </asp:UpdatePanel>
</asp:UpdatePanel>

3.Add Javascript which will fire on submit button
 <script language="javascript" type="text/javascript">
 function showWait() {
            var FUpload = document.getElementById('<%= txtUploadDictation.ClientID %>');
            if (FUpload.value.length > 0) {
                $get('ctl00_pageContent_UpdateProgress2').style.display = 'block';
            }
            var div = document.getElementById('progressBarDiv');
            div.style.visibility = 'visible';
            document.getElementById('progressBarDiv').innerHTML = '<img src=images/preloader.gif><font size=2></font>';1. Add Scipt manager
    <asp:ScriptManager ID="ScriptManager1" runat="server">
    </asp:ScriptManager>

2.Add update panel and add ajax progress in it and file upload control in it
 <asp:UpdatePanel ID="UpdatePanel1" runat="server">
  <ContentTemplate>
<table width="100%" border="0" cellspacing="0" cellpadding="0">
                    <tr>
                                    <td class="middleFormField2">
                                        <asp:Label ID="lblNew" Text="Upload New Dictation:" runat="server"></asp:Label>
                                        <asp:Label ID="lblUpdate" Text="File Name:" runat="server"></asp:Label><strong><font
                                            color="#FF0000">*</font></strong>
                                    </td>
                                    <td align="left" class="middleFormField2">
                                        <table>
                                            <tr>
                                                <td valign="top">
                                                    <asp:UpdateProgress ID="UpdateProgress2" AssociatedUpdatePanelID="UpdatePanel1" runat="server">
                                                        <ProgressTemplate>
                                                            <div style="visibility: hidden" id="progressBarDiv">
                                                                <font style="color: #000000" color="#336633" size="2"></font>
                                                                <img src="images/preloader.gif" />
                                                            </div>
                                                        </ProgressTemplate>
                                                    </asp:UpdateProgress>
                                                </td>
                                                <td>
                                                    <asp:FileUpload ID="txtUploadDictation" runat="server" Font-Names="verdana" Font-Size="Small" />
                                                    <asp:RequiredFieldValidator ID="txtUploadDictation_validate" runat="server" ControlToValidate="txtUploadDictation"
                                                        Display="None" ErrorMessage="You have not uploaded a file for dictation. Please upload a file to proceed"
                                                        SetFocusOnError="true" ValidationGroup="client" />
                                                    <asp:Label ID="lblFileName" runat="server" Font-Bold="true" Text=""></asp:Label>
                                                    <div style="visibility: hidden" id="progressBarDivText">
                                                        <font style="color: Purple" size="1">Processing, Please Wait...</font>
                                                    </div>
                                                </td>
                                            </tr>
                                        </table>
                                    </td>
                                </tr>
<tr>
                                    <td colspan="2" valign="top" class="middleFormField">
                                        <div align="center">
                                            <asp:ImageButton ID="submitButton" runat="server" ImageUrl="images/submitDictationBtn.gif"
                                                CausesValidation="true" Width="137" Height="20" border="0" OnClick="submitButton_Click"
                                                OnClientClick="javascript:showWait();" ValidationGroup="client" />
                                        </div>
                                    </td>
                                </tr>
</table>
</ContentTemplate>
 <Triggers>
                <asp:PostBackTrigger ControlID="submitButton"></asp:PostBackTrigger>
            </Triggers>
        </asp:UpdatePanel>
</asp:UpdatePanel>

3.Add Javascript which will fire on submit button
 <script language="javascript" type="text/javascript">
 function showWait() {
            var FUpload = document.getElementById('<%= txtUploadDictation.ClientID %>');
            if (FUpload.value.length > 0) {
                $get('ctl00_pageContent_UpdateProgress2').style.display = 'block';
            }
            var div = document.getElementById('progressBarDiv');
            div.style.visibility = 'visible';
            document.getElementById('progressBarDiv').innerHTML = '<img src=images/preloader.gif><font size=2></font>';
            var div1 = document.getElementById('progressBarDivText');
            div1.style.visibility = 'visible';
            //document.getElementById('progressBarDiv').innerHTML = '<img src=images/Progress4.gif><font size=2></font>';
        }
</script>

            var div1 = document.getElementById('progressBarDivText');
            div1.style.visibility = 'visible';
            //document.getElementById('progressBarDiv').innerHTML = '<img src=images/Progress4.gif><font size=2></font>';
        }
</script>