Microsoft Asp.Net Ajax框架入门(13) PageRequestManager

VS 2008

本文介绍在异步提交过程中发挥着重大作用的客户端 PageRequestManager对象。

1. PageRequestManager 客户端事件模型
    PageRequestManager是一个客户端的javascript对象，当发生异步postback请求时，伴随之一系列的事件发生

    有了这个事件模型，在客户端，我们便可以跟踪异步postback过程，可以做一些特别的处理等。
    
2. 跟踪异步处理过程

    页面中放置了ScriptManager控件，和一个UpdatePanel控件，然后放了一个divProgress，用于显示一些提示信息

<asp:ScriptManager ID="ScriptManager1" runat="server">
    </asp:ScriptManager>
    <div>
        <asp:UpdatePanel ID="uPanel1" runat="server" UpdateMode="Conditional">
            <ContentTemplate>
                <asp:TextBox ID="txtUserName" runat="server" />
                <asp:Button ID="btnShowName" runat="server" Text="show name" 
                    onclick="btnShowName_Click" />
            </ContentTemplate>
        </asp:UpdatePanel>
        <div id="divProgress"></div>
    </div>

    btnShowName的Click处理方法，用Thread.Sleep模拟提交结果返回的延时

protected void btnShowName_Click(object sender, EventArgs e) {
        System.Threading.Thread.Sleep(2000);
        txtUserName.Text = "guozhijian";
    }

    现在看javascript：

<script type="text/javascript">
        function pageLoad() {
            var req = Sys.WebForms.PageRequestManager.getInstance();
            req.add_beginRequest(function(sender, eventArgs) {
                $get('divProgress').innerHTML = "loading";
            });
            req.add_endRequest(function(sender, eventArgs) {
                $get('divProgress').innerHTML = "";
            });
        }
    </script>

    当点击btnShowName开始异步请求时，beginRequest事件发生，divProgress显示："loading..."。
    然后endRequest事件发生，divProgress显示信息被clear了，文本框显示"guozhijian"。

3. 中断异步回刷请求

    在UpdatePanel中添加一个btnCancel控件：

<div>
        <asp:UpdatePanel ID="uPanel1" runat="server" UpdateMode="Conditional">
            <ContentTemplate>
                <asp:TextBox ID="txtUserName" runat="server" />
                <asp:Button ID="btnShowName" runat="server" Text="show name" 
                    onclick="btnShowName_Click" />
                <asp:Button ID="btnCancel" runat="server" Text="cancel" />
            </ContentTemplate>
        </asp:UpdatePanel>
        <div id="divProgress"></div>
    </div>

    (suddenly I can't input chinese -.-! so i have no choice but use english in substitution for chinese)

    then, i am going to modify the javascript, I call the argument's get_postBackElement() function and get the id property's value, if the value equals 'btnCancel', then I know that the btnCancel button was just clicked, so I call the req's abortPostBack() function.
    note that although the partial page rendering request has been aborted, the endRequest event still gonna happen!

<script type="text/javascript">
        function pageLoad() {
            var req = Sys.WebForms.PageRequestManager.getInstance();
            
            req.add_beginRequest(function(sender, args) {
                $get('divProgress').innerHTML = "loading";
                if(args.get_postBackElement().id == 'btnCancel') {
                    req.abortPostBack();
                }
                
            });
            req.add_endRequest(function(sender, args) {
                $get('divProgress').innerHTML = "";
                
            });
        }
    </script>

 
     
4. 异常处理
     
    Also, we can use PageRequestManager for handling exception.
    Let the btnShowName_Click method throw an exception:

protected void btnShowName_Click(object sender, EventArgs e) {
        throw new Exception("an error occured");
        txtUserName.Text = "guozhijian";
    }

    Regardless of whether an error occurs during an asynchronous postback, the PageRequestManager raises the endRequest event, so we write error handling code like this:

req.add_endRequest(function(sender, args) {
                $get('divProgress').innerHTML = args.get_error().message;
                args.set_errorHandled(true);
                
            });

    don't forget to write the line : args.set_errorHandled(true), or an window alert box will show unexpectedly.