Update two updatable panels at the same time

Question

I have two ASP.NET AJAX UpdatePanels. There are two timers at different intervals. Is it possible to simultaneously update two updated panels at the same time? as a multi-threaded application. each of them must be UpdatePanel Update in a separate thread at a time. I wrote this code, but the second timer does not work:

<asp:Content ID="BodyContent" runat="server" ContentPlaceHolderID="MainContent"> <h2> Welcome to ASP.NET! </h2> <p> <asp:ScriptManager ID="ScriptManager1" runat="server"> </asp:ScriptManager> </p> <asp:UpdatePanel ID="UpdatePanel1" runat="server"> <ContentTemplate> <asp:Label ID="Label1" runat="server" Text="Label"></asp:Label> </ContentTemplate> </asp:UpdatePanel> <asp:UpdatePanel ID="UpdatePanel2" runat="server"> <ContentTemplate> <asp:Label ID="Label2" runat="server" Text="Label"></asp:Label> </ContentTemplate> </asp:UpdatePanel> <asp:Timer ID="Timer1" runat="server" Interval="2000"> </asp:Timer> <asp:Timer ID="Timer2" runat="server" Interval="2000"> </asp:Timer> </asp:Content> 

Behind the code:

  Protected Sub Timer1_Tick(sender As Object, e As System.EventArgs) Handles Timer1.Tick Label1.Text = Date.Now End Sub Protected Sub Timer2_Tick(sender As Object, e As System.EventArgs) Handles Timer2.Tick Label2.Text = Date.Now End Sub 

Answer 1

In fact, your UpdatePanels are useless in this example because your timers are outside of them. As a result, every time your event fires, it refreshes the entire page. (This is partly because you never see the second timer hit - by the time the first timer hits the first page, the entire page is updated, so the counter is reset to the first timer)

So, you need to do two things to fix your page:

• Get UpdatePanels to work properly with timers so that only asynchronous events occur.
• Make sure that each timer causes an update to only one UpdatePanel.

First of all, you can take care of moving the timer in the UpdatePanel as a child or using the <asp:Triggers> element, to basically say: "The only thing that will update my UpdatePanel is the timer."

The second can be taken care of by setting the UpdateMode=Conditional attribute on each UpdatePanel.

Try the following:

 <asp:Content ID="BodyContent" runat="server" ContentPlaceHolderID="MainContent"> <h2> Welcome to ASP.NET! </h2> <p> <asp:ScriptManager ID="ScriptManager1" runat="server"> </asp:ScriptManager> </p> <asp:UpdatePanel ID="UpdatePanel1" runat="server" ChildrenAsTriggers="false" UpdateMode="Conditional"> <ContentTemplate> <asp:Label ID="Label1" runat="server" Text="Label"></asp:Label> </ContentTemplate> <Triggers> <asp:AsyncPostBackTrigger ControlID="Timer1" /> </Triggers> </asp:UpdatePanel> <asp:UpdatePanel ID="UpdatePanel2" runat="server" ChildrenAsTriggers="false" UpdateMode="Conditional"> <ContentTemplate> <asp:Label ID="Label2" runat="server" Text="Label"></asp:Label> </ContentTemplate> <Triggers> <asp:AsyncPostBackTrigger ControlID="Timer2" /> </Triggers> </asp:UpdatePanel> <asp:Timer ID="Timer1" runat="server" Interval="2000" ontick="Timer1_Tick"> </asp:Timer> <asp:Timer ID="Timer2" runat="server" Interval="2000" ontick="Timer2_Tick"> </asp:Timer> </asp:Content> 

I need to run to work now, so bear with me if you have any questions; -)