Simple Ajax program needs to update single update panel on a button click does both. Here is the updated code,
<asp:UpdatePanel ID="UpdatePanel1" UpdateMode="Conditional" ChildrenAsTriggers="false"
runat="server">
<ContentTemplate>
<fieldset style="width: 30%">
<legend>Panel - 1 </legend>
<asp:Label ID="label1" runat="server"></asp:Label>
<asp:Button ID="b1" runat="server" OnClick="both" Text="Update Both Pannels" />
<asp:Button ID="b2" runat="server" OnClick="one" Text="Update Single Pannel" />
</fieldset>
</ContentTemplate>
<Triggers>
<asp:AsyncPostBackTrigger ControlID="b1" EventName="Click" />
</Triggers>
</asp:UpdatePanel>
<asp:UpdatePanel ID="UpdatePanel2" runat="server" ChildrenAsTriggers="true" UpdateMode="Conditional">
<ContentTemplate>
<fieldset style="width: 30%">
<legend>Panel - 2 </legend>
<asp:Label ID="label2" runat="server"></asp:Label>
</fieldset>
</ContentTemplate>
<Triggers>
<asp:AsyncPostBackTrigger ControlID="b2" EventName="Click" />
</Triggers>
</asp:UpdatePanel>
Button Click events are as follows,
protected void both(object sender, EventArgs e)
{
label1.Text = DateTime.Now.ToLongTimeString();
label2.Text = DateTime.Now.ToLongTimeString();
UpdatePanel2.Update();
}
protected void one(object sender, EventArgs e)
{
label1.Text = DateTime.Now.ToLongTimeString();
label2.Text = DateTime.Now.ToLongTimeString();
UpdatePanel2.Update();
}
The output remains same..Thanks in advance...
From Reference to MSDN If the UpdateMode property is set to Conditional, the UpdatePanel control’s content is updated when one of the following is true:
So Set ChildrenAsTigger to false set asynchrnous trigger for your first update panel like below.
<asp:UpdatePanel ID="UpdatePanel1" UpdateMode="Conditional" ChildrenAsTriggers="false" runat="server">
<ContentTemplate>
<fieldset style="width:30%">
<legend>Panel - 1
</legend>
<asp:Label ID="label1" runat="server"></asp:Label>
<asp:Button ID="b1" runat="server" OnClick="both" Text="Update Both Pannels" />
<asp:Button ID="b2" runat="server" OnClick="one" Text="Update Single Pannel" />
</fieldset>
</ContentTemplate>
<Triggers>
<asp:AsyncPostBackTrigger ControlID="b1" EventName="Click" />
</Triggers>
</asp:UpdatePanel>
<asp:UpdatePanel ID="UpdatePanel2" runat="server" ChildrenAsTriggers="true" UpdateMode="Conditional">
<ContentTemplate>
<fieldset style="width:30%">
<legend>Panel - 2
</legend>
<asp:Label ID="label2" runat="server"></asp:Label>
</fieldset>
</ContentTemplate>
<Triggers>
<asp:AsyncPostBackTrigger ControlID="b2" EventName="Click" />
</Triggers>
</asp:UpdatePanel>
After that on click of B1 BUTTON update the sceond update panel explicitly...like below
protected void both(object sender, EventArgs e)
{
label1.Text = DateTime.Now.ToLongTimeString();
label2.Text = DateTime.Now.ToLongTimeString();
UpdatePanel2.Update();
}
protected void one(object sender, EventArgs e)
{
label1.Text = DateTime.Now.ToLongTimeString();
label2.Text = DateTime.Now.ToLongTimeString();
UpdatePanel2.Update();
}