Giving Precedence to a Specific Asynchronous Postback

Introduction

By default, when a page makes multiple asynchronous postbacks at the same time, the postback made most recently takes precedence. In some scenarios, you might want to give precedence to a specific asynchronous postback and cancel the other postbacks.

Defines a handler for the load event of the Sys.Application class. The handler in turn registers a handler named InitializeRequest for the initializeRequest event of the PageRequestManager class.

Defines the InitializeRequest handler to check whether an asynchronous postback is currently executing, and to determine the name of the element that caused the postback. If the element that caused the postback is one that you have specified as an exclusive postback element (one that should take precedence), the new postback is canceled by setting the cancel property of the InitializeRequestEventArgs class.

Defines an ActivateAlertDiv function that toggles the visibility of a <div> element on the page in order to display messages.

Using the Script with an UpdatePanel Control

In this procedure you will use the script that you created in a page. The page contains one button whose postback takes precedence over the postback of another button on the page.

To create a page to make sure postback from one postback takes precedence

Create a new single-file ASP.NET Web page and switch to Design view.

In the AJAX Extensions tab of the toolbox, double-click the ScriptManager control to add it to the page.

Double-click the UpdatePanel control two times to add two instances of the control to the page.

In each UpdatePanel control, from the Standard tab of the toolbox. add a Label control and a Button control.

Set the Text value of the Label control in both panels to Panel Initially Rendered.

Double-click each Button control to add a handler for each button's Click event.

Add the following code for the Click handlers, which artificially creates a delay and then displays the current time in the panel where the postback originated:

The handlers for the Click event intentionally introduce a delay for this tutorial. In practice, you would not introduce a delay. Instead, the delay would be the result of server traffic or of server code that takes a long time to process, such as a long-running database query.

Switch to Source view, and then add the following <style> block in the <head> element of the page:

In the Properties window, select the Scripts property and click the ellipsis (…) button to display the ScriptReference Collection Editor dialog box.

Click Add to add a script reference.

Set the Path property of the script reference to PostbackPrecedence.js, which is the JavaScript file that you created previously.

Adding a script reference by using the Scripts collection of the ScriptManager makes sure that the script is loaded after the Microsoft AJAX Library has loaded.

Click OK to close the ScriptReference Collection Editor dialog box.

Save your changes and then press CTRL+F5 to view the page in a browser.

Click the button in the first panel and then click the button in the second panel.

A message is displayed that indicates that the new postback was canceled. The button in the first panel must finish before a new postback is initiated. The script file provides the logic to enforce this behavior.

Click the button in the second panel and then click the button in the first panel.

The button in the second panel does not take precedence because it was not coded to do this in the script file. Therefore, no warning message is displayed and a new postback is initiated by the button in the first panel. This is the default behavior of asynchronous postbacks—the most recent postback takes precedence.

Review

This tutorial shows how to enable a specific asynchronous postback to take precedence (that is, to finish processing) before another asynchronous postback starts. The logic for enforcing this behavior is in a JavaScript file that is included as a script reference for the page. The script can be customized so that all current asynchronous postbacks must finish before any new one is started. However, you should carefully consider your design when you specify which postbacks take precedence.