Saturday, March 21, 2009

prevent Concurrent Asynchronous postback

By default, when a page makes multiple asynchronous postbacks at the same time, the postback made most recently takes precedence. For example, user clicks on a button which generates asynchronous postback. Now before the response of the asynchronous postback comes to client, user click another button which also generates asynchronous postback. In this case the response of the first button's event will be discarded by the client. So user will not find the update information as the  the first button's event.

So in this case there are two approaches to handle the situation:

1. When a asynchronous postback is in progress, user will not be able to initiate another postback.

2. if user initiates multiple asynchronous postbacks then we can queue the requests and send them one by one. But in this case timeout is a problem.

 

Approach 1: Prevent users to initiate multiple asynchronous postbacks:

    <script type="text/javascript">

        var Page;

        function pageLoad() {

            Page = Sys.WebForms.PageRequestManager.getInstance();

            Page.add_initializeRequest(OnInitializeRequest);

        }

        function OnInitializeRequest(sender, args) {

            var postBackElement = args.get_postBackElement();

            if (Page.get_isInAsyncPostBack()) {

                alert('One request is already in progress.');

                args.set_cancel(true);

            }

        }    

    </script>

In the above code block, we are hooking OnInitializeRequest event on every request's initialize event. In the initialize event handler (OnInitializeRequest) we are checking if an asynchronous request is in progress. if so then canceling the current request.

 

Approach 2: Queue asynchronous requests

Andrew Fedrick describes in his blog how to queue asynchronous requests here.

For simplicity, my recommendation is to prevent users to initiate multiple asynchronous requests.

 

Some Useful Links

http://msdn.microsoft.com/en-us/library/bb386456.aspx

http://www.dotnetcurry.com/ShowArticle.aspx?ID=176&AspxAutoDetectCookieSupport=1

http://weblogs.asp.net/andrewfrederick/archive/2008/03/27/handling-multiple-asynchronous-postbacks.aspx

http://www.codedigest.com/CodeDigest/41-Cancel-Multiple-Asynchronous-Postback-from-Same-Button-in-ASP-Net-AJAX.aspx

5 comments:

  1. //preventing multiple postbacks without
    //the Microsoft AJAX framework
    //by override the __doPostBack-function
    var oldPostBack;
    var submitting = false;
    function window.onload() {
    oldPostBack = __doPostBack;
    __doPostBack = overridePostBack;
    }
    function overridePostBack(eventTarget, eventArgument) {
    if (submitting) {
    alert('One request is already in progress.');
    }
    else {
    submitting = true;
    oldPostBack(eventTarget, eventArgument);
    }
    }

    ReplyDelete
  2. I wish there was an example showing how to use this code snippet - I'm new to ASP.NET and don't know how to connect my button to the functions in this script.

    ReplyDelete
  3. Approach 1 works perfectly for me. Thanks!

    ReplyDelete
  4. you saved my weekend dude! thanks!

    ReplyDelete