Saturday, May 30, 2009

ASP.NET 2.0 AJAX Extensions Update Panel - Nested Update Panel

If you have been following my articles, you would have realised how easy it is to implement partial page refreshing in ASP.NET AJAX where we explored a single UpdatePanel and multiple Update Panel examples.

Let us now consider a more complex scenario where we want to nest Update Panels.
UpdatePanel 1 (Parent)
UpdatePanel 2 (Child)

The thumb rule with nested update panels is as follows:-
Parent Update Panel refreshes all the contents including Child Update Panel's contents even if the Child Update Panel's update mode is set to Conditional
Child Update Panel refreshes only its contents and doesnt refresh that of the Parent Update Panel unless, the update mode for the parent update panel is not set to Conditional
Kind of confusing eh? Let us see it in action. Copy paste the following HTML and the subsequent source code to see it in action.
see full detail:

No comments: