Update Panel control

First step one should take to understand UpdatePanel – what it is and what it can do…

MSDN – UpdatePanel Class
MSDN – UpdatePanel Control Overview

There’s a lot of information. Some are easy, some are a bit more trickier. Extracting some below…

UpdatePanel’s update process is coordinated by the ScriptManager server control and the client PageRequestManager class. An asynchronous postback behaves like a regular postback in that the resulting server page executes the complete page and control life cycle. However, with an asynchronous postback, page updates are limited to the regions of the page that are enclosed in UpdatePenel controls and that are marked to be updated.

Add content to UpdatePanel

  • Declaratively – just include between <ContentTemplate></ContentTemplate>
  • Programmatically – use ContentTemplateContainer property

By default, any postback control inside an UpdatePanel control causes an asynchronous postback and refreshes the panel’s content, or you can specify a trigger. A trigger is a binding that specifies which postback control and event cause a panel to update. Controls inside an UpdatePanel control that causes a postback are automatically configured as triggers for the UpdatePanel control. To disable Automatic Triggers, set ChildrenAsTriggers to false and UpdateMode to Conditional. To specify triggers declaratively, register a control by using the RegisterAsyncPostBackControl method of the ScriptManager control. Controls that are programmatically identified as triggers must be registered every time that a postback occurs. It’s recommanded to be registered in Page_Load.

Example: ScriptManager1.RegisterAsyncPostBackControl(SurveyDataList);

How UpdatePanel Controls Are Refreshed:

  • If the UpdateMode property is set to Always, the UpdatePanel control’s content is updated on every postback that originates from anywhere on the page. This includes asynchronous postbacks from controls that are inside other UpdatePanel controls, and postbacks from controls that are not inside UpdatePanel controls.
  • If the UpdateMode property is set to Conditional, the UpdatePanel control’s content is updated when one of the following is true:
    • When the postback is caused by a trigger for that UpdatePanel control
    • When you explicitly call the UpdatePanel control’s Update method
    • When the UpdatePanel control is nested inside anotehr UpdatePanel control and the parent panel is updated
    • When the ChildrenAsTriggers property is set to true and any child control of the UpdatePanel control causes a postback. Child controls of nested UpdatePanel controls do not cause an update to the outer UpdatePanel control unless they are explicitly defined as triggers for the parent panel.

Nested UpdatePanel Controls work like this:

  • Parent UpdatePanel refreshes all the contents including Child UpdatePanel’s contents even if the Child UpdatePanel’s update mode is set to Conditional
  • Child UpdatePanel refreshes only its contents and doesn’t refresh that of the Parent UpdatePanel if the update mode for the Parent UpdatePanel is set to Conditional, and the Child UpdatePanel should in this case set to Conditional as well. Regarding setting the Child UpdatePanel also to Conditional, it’s from MSDN, but I tried not having Conditional and it seems to be working too. Oh well…
Enable Partial-Page Rendering in a Custom Control
You can add an UpdatePanel to a user control or to a custom control. However, the page that contains your control might not include the necessary ScriptManager control with its EnablePartialRendering property set to true. Therefore, in your custom control you can determine whether partial-page rendering is enabled by calling the static GetCurrent method of the ScriptManager control. If there is no ScriptManager control on the page, the GetCurrent method returns null. Otherwise, you can check the value of the EnablePartialRendering property of the ScriptManager control and include an UpdatePanel control if the EnablePartialRendering property returns true.
See the code example from MSDN below:
protected override void CreateChildControls() {
    base.CreateChildControls();

    Control parent;
    Control container;

    // Get a reference to the ScriptManager object for the page
    // if one exists.
    ScriptManager sm = ScriptManager.GetCurrent(Page);

    if (sm == null || !sm.EnablePartialRendering)
    {
        // If partial rendering is not enabled, set the parent
        // and container as a basic control. 
        container = new Control();
        parent = container;
    }
    else
    {
        // If partial rendering is enabled, set the parent as
        // a new UpdatePanel object and the container to the 
        // content template of the UpdatePanel object.
        UpdatePanel up = new UpdatePanel();
        container = up.ContentTemplateContainer;
        parent = up;
    }

    AddDataboundControls(container);

    Controls.Add(parent);
}

Exposing the Capabilities of the UpdatePanel Control Publicly – just the typical .NET way, use properties
Adding Code to Refresh the User Controls – call the Update method of the inner UpdatePanel control

(Code below straight from MSDN)

public UpdatePanelUpdateMode UpdateMode
{
    get { return this.EmployeeInfoUpdatePanel.UpdateMode; }
    set { this.EmployeeInfoUpdatePanel.UpdateMode = value; }
}

public void Update()
{
    this.EmployeeInfoUpdatePanel.Update();
}

To be continued…

By Bryan Xu

Posted in Ajax Controls

Leave a Reply