Multiple ASP.NET AJAX Progress Controls

Question

Can someone explain how to resolve this?

Two update panels, two progress controls, two command buttons.

When I click first button I can see the progress for the first async update. When I click the second command button - the first progress bar disappears if the first async operation is still in progress. How can I display two progress controls at the same time.

    <html xmlns="http://www.w3.org/1999/xhtml" >
<head id="Head1" runat="server">
    <title>UpdateProgress Tutorial</title>
    <style type="text/css">
    #UpdatePanel1, #UpdatePanel2 { 
      width:300px; height:100px;
     }
    </style>
</head>
<body>
    <form id="form1" runat="server">
    <div>
        <asp:ScriptManager ID="ScriptManager1" runat="server">
        </asp:ScriptManager>
        <asp:UpdatePanel ID="UpdatePanel1" runat="server">
            <ContentTemplate>
                <fieldset>
                <legend>UpdatePanel1</legend>
                <asp:Label ID="Label1" runat="server" Text="Panel initially rendered."></asp:Label>
                <br />
                <asp:Button ID="Button1" runat="server" Text="Button" OnClick="Button1_Click" />
                <asp:UpdateProgress ID="UpdateProgress1" runat="server" AssociatedUpdatePanelID="UpdatePanel1">
                    <ProgressTemplate>
                        Panel1 updating...
                    </ProgressTemplate>
                </asp:UpdateProgress>
                </fieldset>
            </ContentTemplate>
        </asp:UpdatePanel>
        <asp:UpdatePanel ID="UpdatePanel2" runat="server">
            <ContentTemplate>
                <fieldset>
                <legend>UpdatePanel2</legend>
                <asp:Label ID="Label2" runat="server" Text="Panel initially rendered."></asp:Label>
                <br />
                <asp:Button ID="Button2" runat="server" Text="Button" OnClick="Button2_Click" />
                <asp:UpdateProgress ID="UpdateProgress2" runat="server" AssociatedUpdatePanelID="UpdatePanel2">
                    <ProgressTemplate>
                        Panel2 updating....
                    </ProgressTemplate>
                </asp:UpdateProgress>
                </fieldset>
            </ContentTemplate>
        </asp:UpdatePanel>

    </div>
    </form>
</body>
</html>

Code

    protected void Button1_Click(object sender, EventArgs e)
{
    // Introducing delay for demonstration.
    System.Threading.Thread.Sleep(10000);
    Label1.Text = "Page refreshed at " +
        DateTime.Now.ToString();
}

protected void Button2_Click(object sender, EventArgs e)
{
    // Introducing delay for demonstration.
    System.Threading.Thread.Sleep(15000);
    Label2.Text = "Page refreshed at " +
        DateTime.Now.ToString();

}

If I find some time later I will replay again with more details. The first post that you make is not cancel when you make the second call, and the second call is locked and wait the first one because of the session lock. — Aristos, Feb 06 '13 at 17:17
Thank you for you time. I think I deleted my previous comments. I do not see them any more. For now I am going to combine multiple database updates in single async call with single progress control. — Serghei T, Feb 06 '13 at 17:29

score 0 · Answer 1 · answered Feb 07 '13 at 18:07

0

Perhaps what is needed is to configure the update panels to update conditionally: UpdateMode = "Conditional"

Check this link: http://msdn.microsoft.com/es-mx/library/system.web.ui.updatepanel.updatemode.aspx

answered Feb 07 '13 at 18:07

Vicente Hernández

86
2

score 0 · Answer 2 · answered Apr 12 '13 at 14:49

In general web works on Request-Response basis. When page send Request it should wait for Response. If page resends[or sends new] Request old Response will be ignored and will wait for Response for new Request.

To avoid this in Ajax queues requests and sends once a reponse has been recieved. [or in other way you can say on page works as single thread]

In your case first Progress bar should not go away even behind the seen it waits for response. this can be fixed using some javascript but there isn't any off the box support.

Or you can use Iframes to truly send simulteneous multiple requests.

Multiple ASP.NET AJAX Progress Controls

2 Answers2