AsyncPostBackTrigger isn't working with simultaneous update calls

Question

I have a page with some UpdatePanels, each one with its own button to update it. Since the update routines can take some time, I thought making them Asynchronous would help loading the page step by step.

But doing so, when I fire programatically the update routine of each panel, I get only the last UpdatePanel updated.

Here is an example of the code, with two UpdatePanels. There is the requirement that the update routine have to be fired on clientside pageLoad function.

Is it a bug or am I missing something in the code?

Thanks =)

<asp:UpdatePanel ID="Panel1" runat="server" UpdateMode="Conditional">
  <ContentTemplate>
    <asp:TextBox ID="Text1" runat="server" />
    <asp:Button ID="Button1" runat="server" />
  </ContentTemplate>
  <Triggers>
    <asp:AsyncPostBackTrigger ControlID="Button1" EventName="Click" />
  </Triggers>
</asp:UpdatePanel>

<asp:UpdatePanel ID="Panel2" runat="server" UpdateMode="Conditional">
  <ContentTemplate>
    <asp:TextBox ID="Text2" runat="server" />
    <asp:Button ID="Button2" runat="server" />
  </ContentTemplate>
  <Triggers>
    <asp:AsyncPostBackTrigger ControlID="Button2" EventName="Click" />
  </Triggers>
</asp:UpdatePanel>

And the client-side code:

function pageLoad()
{
  $('#Button1').click();
  $('#Button2').click();
}

Answer 1

Here is why:

By default, when a page makes multiple asynchronous postbacks at the same time, the postback made most recently takes precedence.

http://www.asp.net/ajax/documentation/live/tutorials/ExclusiveAsyncPostback.aspx

Here is a solution:
Handling Multiple Asynchronous Postbacks