UpdatePanel的简单用法(3) --客户端编程3

来源：互联网发布：mac 如何设置桌面图标编辑：程序博客网时间：2024/06/05 17:41

PageRequestManager-pageLoading事件(客户端已经获得服务器结果，但是还没有对页面进行设置时触发)

参数类型：PageLoadingEventArgs
dataItems属性: 获得服务器端的注册数据项

panelsDeleting属性: 获得即将删除的UpdatePanel

panelsUpdating属性：获得即将更新的UpdatePanel

注意：如果updatePanel是恰套使用

外部的updatePanel刷新时候，里面的updatePanel会先删除内部的updatePanel然后再创建

此时会有panelsDeleting属性

常见操作：

提示更新的updatepanel

获得服务的服务器端注册的数据项

PageRequestManager-pageLoading事件的例子，显示更新的 updatePanel

为了简化代码：用了个简单的用户控件

<%@ Control Language="C#" AutoEventWireup="true" CodeBehind="WebUserControl1.ascx.cs" Inherits="AJAXEnabledWebApplication1.WebUserControl1" %>
<asp:UpdatePanel ID="UpdatePanel1" runat="server" UpdateMode="Conditional">
<ContentTemplate>
<%=DateTime.Now.ToString() %>
</ContentTemplate>
</asp:UpdatePanel>

cs 代码：

using System;
using System.Collections;
using System.Configuration;
using System.Data;
using System.Web;
using System.Web.Security;
using System.Web.UI;
using System.Web.UI.HtmlControls;
using System.Web.UI.WebControls;
using System.Web.UI.WebControls.WebParts;
namespace AJAXEnabledWebApplication1
{
    public partial class WebUserControl1 : System.Web.UI.UserControl
    {
        public static Random random = new Random(DateTime.Now.Millisecond);
        protected void Page_Load(object sender, EventArgs e)
        {
            if (random.NextDouble() > 0.5)
            {
                this.UpdatePanel1.Update();
            }
        }
    }
}

页面代码：

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="WebForm6.aspx.cs" Inherits="AJAXEnabledWebApplication1.WebForm6" %>
<%@ Register src="WebUserControl1.ascx" tagname="WebUserControl1" tagprefix="uc1" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" >
<head runat="server">
    <title>无标题页</title>
</head>
<body>
    <form id="form1" runat="server">
    <asp:ScriptManager ID="ScriptManager1" runat="server">
    </asp:ScriptManager>
    
    <br />
    <uc1:WebUserControl1 ID="WebUserControl11" runat="server" />
    <br />
    <uc1:WebUserControl1 ID="WebUserControl12" runat="server" />
    <br />
     <uc1:WebUserControl1 ID="WebUserControl13" runat="server" />
     <br />
         <uc1:WebUserControl1 ID="WebUserControl14" runat="server" />
         <br />
             <uc1:WebUserControl1 ID="WebUserControl15" runat="server" />
    <asp:Button ID="Button1" runat="server" Text="Button" /> 
    <script type="text/javascript" language="javascript">
    function hightLightPanels(panels,clear){
        for(var i=0;i<panels.length;i++){
           var panel=panels[i];
           panel.style.border=clear?"solid 0px white":"solid 1px red";
           panel.style.backgroundcolor=clear?"white":"#34ff44";
        }
    }
    
    Sys.WebForms.PageRequestManager.getInstance().add_pageLoading(
        function(sender, e){
             //e.get_panelsUpdating() 获得需要更新的panels的数组
             //Array.clone()获的一份copy
            var panelsUpdating=Array.clone(e.get_panelsUpdating());
            hightLightPanels(panelsUpdating);
            window.setTimeout(
            function(){
                hightLightPanels(panelsUpdating,true);
            },2000
            );
        }
    );
    </script>
    </form>
</body>
</html>

cs代码：

using System;
using System.Collections;
using System.Configuration;
using System.Data;
using System.Web;
using System.Web.Security;
using System.Web.UI;
using System.Web.UI.HtmlControls;
using System.Web.UI.WebControls;
using System.Web.UI.WebControls.WebParts;
namespace AJAXEnabledWebApplication1
{
    public partial class WebForm6 : System.Web.UI.Page
    {
        protected void Page_Load(object sender, EventArgs e)
        {
            //注册button为异步更新控件
            ScriptManager.GetCurrent(this).RegisterAsyncPostBackControl(this.Button1);
        }
    }
}

就这么多了