UpdatePanel客户端的应用

PageRequestManager类

*  getInstance静态方法
     – 获得全局唯一的PageRequestManager实例
*  isInAsyncPostBack属性
     – 是否正处在一个异步更新过程中
*  abortPostBack方法
     – 取消当前的异步更新
     – 不会产生异常

UpdatePanel客户端生命周期

*  PageRequestManager的事件
      – 异步刷新时触发
      – initializeRequest
      – beginRequest
      – pageLoading
      – pageLoaded
      – endRequest

下面对这5个事件分别举例说明它们的应用：

 initializeRequest事件

*  常用操作：
    – 读取请求信息
    – 取消此次异步更新

// 页面中有控件同时发起异步刷新 并且它们有优先级别之分
< script type = " text/javascript "  language = " javascript " >
     var  lastPostBackButtonId  =   null ; // 发起上一次异步请求的控件 这里是Button
     var  btnPrecedenceId  =   " <%= this.btnPrecedence.ClientID %> " ; // 优先级别高的异步请求Button
     // initializeRequest的参数为InitializeRequestEventArgs
    Sys.WebForms.PageRequestManager.getInstance().add_initializeRequest(
         function (sender, e)
         ... {
            var prm = Sys.WebForms.PageRequestManager.getInstance();//获取PRM的全局唯一实例
            if (prm.get_isInAsyncPostBack())//是否处于异步更新中
            ...{
                if (lastPostBackButtonId == btnPrecedenceId)//如果上次请求的优先级别高
                ...{
                    e.set_cancel(true);//取消当前的异步请求
                    
                    if (e.get_postBackElement().id == btnPrecedenceId)//如果当前请求也是高优先级别
                    ...{
                        showMessage("不可重复发起优先的刷新。");
                    }
                    else
                    ...{
                        showMessage("请等待优先的刷新结束。");
                    }
                    
                    return;
                }
                //如果上次是优先级别底的请求
                else if (e.get_postBackElement().id == btnPrecedenceId)//当前请求为优先级别高的
                ...{
                    showMessage("发起优先的刷新，普通的刷新将被取消。");
                }
                else
                ...{
                    showMessage("重新发起普通的刷新，前一次提交将被取消。");
                }
            }
            
            lastPostBackButtonId = e.get_postBackElement().id;//保存当前请求的级别
        } );
script >

PRM – beginRequest事件

*  常用操作：
    – 读取请求信息
    – 改变请求方式（替换Executor）
    – 显示更新提示

如果引发异步更新的是UpdatePanel外部的控件则无法显示UpdateProgress提示。下面解决这问题：

// 强制显示UpdateProgress
< script type = " text/javascript "  language = " javascript " >
    Sys.WebForms.PageRequestManager.getInstance().add_beginRequest(
     function  (sender,e)
     ... {
        if(e.get_postBackElement().id!="<%= this.Button2.ClientID  %>")//如果是UpadtePanel内部控件发起更新则返回
        ...{
            return;
        }
        
        var UpdateProgress=$get("<%= this.UpdateProgress1.ClientID %>");//如果是外部控件引发更新
        var dynamicLayout=<%= this.UpdateProgress1.DynamicLayout.ToString().ToLower() %>
        
        if(dynamicLayout)//判断UpdateProgress是否正在显示
        ...{
            UpdateProgress.style.display="block";//正在显示则维持状态
        }
        else
        ...{
            UpdateProgress.style.visibility = "visible";//不在显示则强制它显示
        }
    }
    );
script >

PRM – pageLoading事件

*  参数类型：PageLoadingEventArgs
    – dataItems属性：获得服务器端注册的数据项
    – panelsDeleting属性：获得即将删除的
        UpdatePanel
    – panelsUpdating属性：获得即将更新的
        UpdatePanel
*  常用操作
    – 提示更新的UpdatePanel
    –   （能够）获得服务器端注册的数据项
对于页面中存在多个UpdatePanel  正在更新的UpdatePanel给予特别提示：

// 突出显示正在更新的UpdatePanel
< script language = " javascript "  type = " text/javascript " >
     function  LightPanels(panels,clear) // 突出显示UpadtePanel
     ... {
        for(var i=0; i<panels.length;i++)
        ...{
            var pan=panels[i];
            pan.style.border=clear ? "solid 0px white":"solid 2px red";
            pan.style.backgroundColor=clear ? "white":"#d6dde8";
        }
    }
    Sys.WebForms.PageRequestManager.getInstance().add_pageLoading(
     function  (sender,e)
     ... {
        var updateingpanels=Array.clone(e.get_panelsUpdating());//找出页面正在更新的UpdatePanel集合
        LightPanels(updateingpanels);//突出显示正在更新的UpdatePanel
        
        window.setTimeout(function()...{LightPanels(updateingpanels,true);},2000);//2秒后让突出显示的UpdatePanel恢复原来样式
        
    } );
script >

PRM – pageLoaded事件

应用 缺

PRM – endRequest事件

*  参数类型：EndRequestEventArgs
    – dataItems属性：获得服务器端注册的数据项
    – error属性：获得异步刷新时获得的错误
    – errorHandled属性：表明错误是否已被处理了
    – response属性：获得这次请求获得的结果对象
*  常用操作：
    – 处理异步刷新结果（异常、超时、取消, etc.）
    – 获得请求结果中额外的信息
    –   （能够）获得服务器端注册的数据项

应用：对于页面错误的处理：

< script language = " javascript "  type = " text/javascript " >
        Sys.WebForms.PageRequestManager.getInstance().add_endRequest(
        function (sender,e) ... {
            if(e.get_error())//捕抓错误
            ...{
                e.set_errorHandled(true);//错误不被抛出，自己处理
                if(e.get_response().get_timedOut())//是否为超时错误
                ...{
                    showMessage("刷新超时！");
                }
                else if(e.get_response().get_statusCode()!=200)//是否为未知错误
                ...{
                    showMessage("发生未知错误！");
                }
                else
                ...{
                    showMessage(e.get_error().message);//直接输出错误信息
                }
                
             }
             else if(e.get_response().get_aborted())//更新是否被取消
             ...{
                    showMessage("请求被取消！");
             }
             else//提示你完成了对哪个控件的更新
             ...{
                var UIp="<%= this.UpdatePanel1.ClientID %>";
                var item=e.get_dataItems()[UIp];
                showMessage("你请求了"+item);
             }
        } );
     script >