• Status: Solved
  • Priority: Medium
  • Security: Public
  • Views: 911
  • Last Modified:

asp.net async progress bar

I'm using VS2008 and have an async progress bar on a page that is part of a project. If I set the page that has the progress bar on it as the start page and run it from VS2008 it runs perfectly, progress bar is updating as expected. Once I try to access the page from either a response.redirect or from a menu item from within the project, the progress bar doesn't get updated.

Any help would be greatly appreciated and if any additional info is required, let me know.

here is the javascript code:

<script type="text/javascript" language="javascript">

    var stopped = false;
    // Starts the async process with parameters if page passes validation
    if (Page_ClientValidate()) {
        function beginRequestHandler(sender, args) {
            stopped = false;
            var invoiceDate = new Date($get('<%= txtInvoiceDate.ClientID %>').value);
            invoiceDate = invoiceDate.getFullYear() + "-" + (invoiceDate.getMonth() + 1) + "-" + invoiceDate.getDate();

            var startDate = new Date($get('<%= txtStartDate.ClientID %>').value);
            startDate = startDate.getFullYear() + "-" + (startDate.getMonth() + 1) + "-" + startDate.getDate();

            var endDate = new Date($get('<%= txtEndDate.ClientID %>').value);
            endDate = endDate.getFullYear() + "-" + (endDate.getMonth() + 1) + "-" + endDate.getDate();

            var ddlCycleID = $get('<%= ddlBillingCycle.ClientID %>');
            var cycleID = ddlCycleID.options[ddlCycleID.selectedIndex].value;

            var ddlType = $get('<%= ddlType.ClientID %>');
            var taxType = ddlType.options[ddlType.selectedIndex].value;

            var userID = '<%= Session("UserID") %>';

            $get('<%= btnConfirm.ClientID %>').disabled = 'disabled';
            $get('<%= btnCancel.ClientID %>').disabled = 'disabled';
            $get('<%= progressPercent.ClientID %>').innerHTML = '0%';
            $get("<%= panelMessages.ClientID %>" + "_MessagePanel").style.display = 'none';
            $get('progressBar').style.width = '0%';
            PageMethods.RunAsync(taxType, invoiceDate, startDate, endDate, cycleID, userID, runAsyncSuccess, runAsyncFailure);
            setTimeout("progressChanged()", 10);

    // Closes the progress bar window and calls the function to refresh grid with results after the async call completes successfully.
    function runAsyncSuccess() {
        if (!stopped) {
            $get('<%= btnConfirm.ClientID %>').disabled = '';
            $get('<%= btnCancel.ClientID %>').disabled = '';
            $get('<%= btnCalculate.ClientID %>').disabled = 'disabled';
            refreshGrid('<%=hfRefereshGrid.ClientID %>');
        stopped = false;

    function runAsyncFailure() {

    function asyncErrors(result) {
        var msgPanel = $get("<%= panelMessages.ClientID %>" + "_MessagePanel");
        msgPanel.style.display = 'block';
        msgPanel.className = 'error';
        msgPanel.innerHTML = result;

    // Calls the Progress method to get the percent complete of the async process
    function progressChanged() {

    // Updates the progress bar with the percent complete of the async process
    function progressSuccess(response) {
        $get('<%= progressPercent.ClientID %>').innerHTML = response + '%';
        $get('progressBar').style.width = response + '%';
        setTimeout("progressChanged()", 10);

    // Cancels the async process
    function cancelAsync() {
        stopped = true;

    // Refreshes the the grid with the results using an async postback
    function refreshGrid(hiddenFieldID) {
        var hiddenField = $get(hiddenFieldID);
        if (hiddenField) {
            hiddenField.value = (new Date()).getTime();
            __doPostBack(hiddenFieldID, '');

Open in new window

here is the code-behind WebMethod code:
' Return the percentage completed  
<WebMethod()> _
Public Shared Function Progress() As Integer
    Return percentage
End Function

' Return any errors/messages that occurred during the async process
<WebMethod()> _
Public Shared Function AsyncErrors() As String
    Return asyncErrMessages
End Function

' Cancel the async call
<WebMethod()> _
Public Shared Sub CancelAsync()
End Sub

' Main routine that initiates the async call
<WebMethod()> _
Public Shared Sub RunAsync(ByVal taxType As String, ByVal invoiceDate As String, ByVal startDate As String, ByVal endDate As String, _
                           ByVal cycleID As String, ByVal userID As String)

    ' Add the list of parameters received from the javascript async call to a List
    Dim args As New List(Of String)

    percentage = 0

    ' Create the backgroundworker to execute the async calls on a separate thread
    bgWorker = New BackgroundWorker()
    bgWorker.WorkerReportsProgress = True
    bgWorker.WorkerSupportsCancellation = True

    Select Case taxType
        ' Set which routine will be run asynchronously
        Case "Services"
            AddHandler bgWorker.DoWork, AddressOf ExportTaxesServices

        Case "Usage"
            AddHandler bgWorker.DoWork, AddressOf ExportTaxesUsage

    End Select

    ' Set the routine that will be called when the progess of the async call changes 
    AddHandler bgWorker.ProgressChanged, AddressOf bgWorker_ProgressChanged

    ' Set the routine that will be called when the async call completes 
    AddHandler bgWorker.RunWorkerCompleted, AddressOf bgWorker_Completed

    ' Start the async process, passing in the parameters

End Sub

' Gets the percentage completed of the async call
Private Shared Sub bgWorker_ProgressChanged(ByVal sender As Object, ByVal e As ProgressChangedEventArgs)
    percentage = e.ProgressPercentage
End Sub

' Gets the result of the async call when completed and reports any errors that may have occurred
Private Shared Sub bgWorker_Completed(ByVal sender As Object, ByVal e As RunWorkerCompletedEventArgs)
    If e.Error IsNot Nothing Then
        asyncErrMessages = e.Error.Message
        Throw New Exception(asyncErrMessages)
    End If
End Sub

Open in new window

1 Solution
This strikes me as overly complex to accomplish a simple progress bar.  You have a webmethod which returns your percentage.  Now all you need to do is set timeout on a webservice which updates your progress bar, and if progress is at 100% then redirect to what you want to display.

That being said, I am not seeing where your entry point is on this progress bar.  Everything is wrapped into functions but what calls the initial run progress function?  Did I miss that, or is it not in the code.  My bet is that where the progress bar is initiated is located in an area which is not called in redirect, but only on initial startup.  You said that the code works fine if this is your start page, so you need to look at what is initiating your code.  Is it on page_load?  Or do you have it tucked somewhere else?
Question has a verified solution.

Are you are experiencing a similar issue? Get a personalized answer when you ask a related question.

Have a better answer? Share it in a comment.

Join & Write a Comment

Featured Post

The new generation of project management tools

With monday.com’s project management tool, you can see what everyone on your team is working in a single glance. Its intuitive dashboards are customizable, so you can create systems that work for you.

Tackle projects and never again get stuck behind a technical roadblock.
Join Now