8/12/2019 AJAX Extensions Update Panel - Multiple Update Panels

1/2

ASP.NET 2.0 AJAX Extensions Update

Panel - Multiple Update Panels

We saw about Update Panel and how it works in its simplest form. Let us explore more complex scenarios where wehave multiple Update Panels, Nested Update Panels, etc.,

One of the main properties of an UpdatePanel is its UpdateMode property. The UpdateMode property is by default setto "Always".

However, when you have more than a single update panel or when you want to control as to when the Update Panelneeds to get refresh, then setting the UpdateMode property to "Condition" is the first step.

Let us consider a scenario where we have 4 Update Panels in a page. For simplicity I am sticking to the Label -Display Current Date functionality. The HTML for the same is as below:-

Section 1

Section 2

Section 3

http://geekswithblogs.net/ranganh/archive/2007/05/16/112524.aspxhttp://geekswithblogs.net/ranganh/archive/2007/05/16/112524.aspxhttp://geekswithblogs.net/ranganh/archive/2007/05/16/112524.aspxhttp://geekswithblogs.net/ranganh/archive/2007/05/16/112524.aspx

8/12/2019 AJAX Extensions Update Panel - Multiple Update Panels

2/2

Section 4

Note that for all the UpdatePanels, I have set the UpdateMode to conditional. The application logic or codebehind for

the above is as follows:-

protected void Page_Load(object sender, EventArgs e){

Label1.Text = System.DateTime.Now.ToString();Label2.Text = System.DateTime.Now.ToString();Label3.Text = System.DateTime.Now.ToString();Label4.Text = System.DateTime.Now.ToString();

}protected void Button1_Click(object sender, EventArgs e){

}protected void Button2_Click(object sender, EventArgs e){

}protected void Button3_Click(object sender, EventArgs e){

}protected void Button4_Click(object sender, EventArgs e){

}

When you run this page, you will notice that there are four Sections - Section 1, 2,3 & 4. When you click on theRefresh button, the date time value gets refreshed only for the particular section. The other values doesnt getchanged.

If you remove the UpdateMode=Conditional

from the above UpdatePanel declarations, you will notice that all thelabels get refreshed.

Hence, setting the UpdateMode as Conditional is important if you like to control the way the UpdatePanels getrefreshed.

Next, we will explore the Nested UpdatePanel example.

Cheers !!!

http://geekswithblogs.net/ranganh/archive/2007/05/16/112524.aspx