Wednesday, September 19, 2007

AJAX.NET UpdatePanel Control Part 1

Introduction to UpdatePanel Control of AJAX.NET

UpdatePanel control with the help of ScriptManager control is a very useful control which helps Ajax.Net developers to achieve partial post backs. The only limitation for using this UpdatePanel control is that there has to be one ScriptManager Control placed already on the page which will perform partial post backs. Not only the page should already contain ScriptManager control, but ScriptManager control has to be the first control to be placed on the page before using any of the Ajax.Net controls.

UpdatePanel control as already defined is a server control that helps ASP.NET Ajax enabled application developers performs partial page updates. To carry particular information to the server and let the page remain interactive to the user is a very involved task and requires its developer to have a good knowledge of client side scripting language JavaScript (currently known as ECMAScript). UpdatePanel control not only takes care of all the scripting that is required for updating any particular section of page but is also responsible for writing browser independent JavaScript

As we already know that AJAX.Net supports asynchronous web application, with the use of UpdatePanel control not only developers get the ease of not writing any client side script but also there is no change while writing server side code. As a developers viewpoint asynchronous post back not only behaves like a regular post back but also performs a complete execution on the server and control life cycle. The benefit of using UpdatePanel control is that limited region of the page that is enclosed in UpdatePanel control marked to be updated are updated. Server responses with the data that was requested by client and on the browsers the client side PageRequestManager class manipulates DOM (Document Object Model) to replace existing HTML with updated information.

Multiple UpdatePanel Controls on a single page
You can have as many UpdatePanel controls on your page as you want and they can also communicate with each other while updating and can help trigger other UpdatePanel controls to send their information asynchronously to the server and get updated in the process.

UpdatePanel Control Usage
When the page that contains one or many UpdatePanel controls is first rendered at client end, all the contents of all the UpdatePanel control are rendered and sent to the client.
UpdatePanel controls can update regions of the page independently depending on the control’s settings and in any particular situation; contents of few or all UpdatePanel controls are updated.
UpdatePanel control like any other server control can be used in
1. In User controls
2. On Master Pages and in Content Pages
3. Nested inside other UpdatePanel controls
4. Inside templated controls such as GridView or Repeater control with minor adjustments in the controls’ properties

UpdatePanel Control Properties
UpdatePanel control is inherited from Control which in turn is inherited from Object class
Properties of UpdatePanel Control
ID
ChildrenAsTriggers
EnableViewState
RenderMode
Triggers
UpdateMode
Visible

2 comments:

Adnan Amin said...

Can you please tell me that how to use mod window control. It shows a popup window on screen. I have tried to use it. Can you send some easy sample on it.

Qazi Arfeen said...

Dear Amin, thanks for reading this article, you have asked a very valuable question, please look for this article's part II very soon , in which i will explain in details the complete usage of this control and of its properties