UpdateProgress control

The UpdateProgress control provides status information about partial-page updates in UpdatePanel controls. You can customize the default content and the layout of the UpdateProgress control. To prevent flashing when a partial-page update is very fast, you can specify a delay before the UpdateProgress control is displayed.

The UpdateProgress control requires specific settings in a web.config file in order to function correctly. If you try to work with this control, and your website doesn't contain the required web.config file, errors appear in the Design view of the page where the control would have appeared. In Design view, if you click the control that is in that state, Microsoft Expression Web will give you the option to create a new web.config file or update your existing web.config file.

Scenarios

The UpdateProgress control helps you design a more intuitive UI when a Web page contains one or more UpdatePanel controls for partial-page rendering. If a partial-page update is slow, you can use the UpdateProgress control to provide visual feedback about the status of the update. You can put multiple UpdateProgress controls on a page, each associated with a different UpdatePanel control. Alternatively, you can use one UpdateProgress control and associate it with all UpdatePanel controls on the page.

Background

The UpdateProgress control renders a <div> element that is displayed or hidden depending on whether an associated UpdatePanel control has caused an asynchronous postback. For initial page rendering and for synchronous postbacks, the UpdateProgress control is not displayed.

Associating an UpdateProgress control with an UpdatePanel Control

You associate an UpdateProgress control with an UpdatePanel control by setting the AssociatedUpdatePanelID property of the UpdateProgress control. When a postback event originates from an UpdatePanel control, any associated UpdateProgress controls are displayed. If you do not associate the UpdateProgress control with a specific UpdatePanel control, the UpdateProgress control displays progress for any asynchronous postback.

If the ChildrenAsTriggers property of an UpdatePanel control is set to false and an asynchronous postback originates from inside that UpdatePanel control, any associated UpdateProgress controls will be displayed.

Creating content for the UpdateProgress control

To specify the message displayed by an UpdateProgress control, place the content you want into the panel in Design view. For example, you can drag other ASP.NET and HTML controls into the panel, then put your cursor in the panel and type directly in it. When you add a message to an UpdateProgress control in Design view, required <ProgressTemplate> tags are automatically added around the content. If you add content to an UpdateProgress control in Code view instead of Design view, you must manually add the <ProgressTemplate></ProgressTemplate> tags if they don't already exist, otherwise the message won't render.

Specifying content layout

When the DynamicLayout property is true, the UpdateProgress control initially occupies no space in the page display. Instead, the page dynamically changes to display the UpdateProgress control contents when needed. To support dynamic display, the control is rendered as a <div> element that has its display style property initially set to none.

When the DynamicLayout property is false, the UpdateProgress control occupies space in the page display, even if the control is not visible. In that case, the <div> element for the control has its display style property set to block and its visibility initially set to hidden.

Putting UpdateProgress controls on the page

You can put UpdateProgress controls inside or outside UpdatePanel controls. An UpdateProgress control is displayed whenever the UpdatePanel control it is associated with is updated as a result of an asynchronous postback. This is true even if the UpdateProgress control is inside another UpdatePanel control.

If an UpdatePanel control is inside another update panel, a postback that originates inside the child panel causes any UpdateProgress controls associated with the child panel to be displayed. It also displays any UpdateProgress controls associated with the parent panel. If a postback originates from an immediate child control of the parent panel, only the UpdateProgress controls associated with the parent panel are displayed. This follows the logic for how postbacks are triggered.

For more information about the UpdateProgress control, see UpdateProgress Control Overview in the MSDN Library.

For a description of all UpdateProgress control properties, see UpdateProgress Properties in the MSDN library.

See also

Concepts

ASP.NET AJAX controls overview