zoukankan      html  css  js  c++  java
  • [转]UpdatePanel的用法详解

    本文转自:http://www.cnblogs.com/shangxia/articles/2281782.html

    今天用做日历显示本月的考勤记录,用到了UpdatePanel控件,才发现对这个控件并不太了解,所以找了点儿资料,整理了一下给大家发上来!

    一、UpdatePanel的结构

    <asp:ScriptManager ID="ScriptManager1" runat="server" > 
    </asp:ScriptManager> 
    <asp:UpdatePanel ID="UpdatePanel1" runat="server" ChildrenAsTriggers="true" UpdateMode="Always" RenderMode="Block"> 
    <ContentTemplate> 
    </ContentTemplate> 
    <Triggers> 
    <asp:AsyncPostBackTrigger /> 
    <asp:PostBackTrigger /> 
    </Triggers> 
    </asp:UpdatePanel>

    主要属性: 

    1,ChildrenAsTriggers : 内容模板内的子控件的回发是否更新本模板(和UpdateMode的conditional有关) 

    2,UpdateMode : 内容模板的更新模式,有always和conditional俩种 

    always:每次ajax PostBack或者普通的PostBack都能引起panel的更新 如果UpdatePanel设置为Always时,不能使用上面的ChildrenAsTriggers属性,强行使用会报错,是updatepanel默认的更新模式,和设置trigger触发器没有直接的关系。 

    conditional:只有满足如下某一条件时才更新panel的内容  如果设置UpdateMode="conditional" ChildrenAsTriggers="false"时候,子控件不允许触发更新 

    1),当panel中的某个控件引发PostBack时  2), 当Panel指定的某个Trigger被引发时 

    3,RenderMode: 局部更新控件的呈现形式,俩中,Block(局部更新在客户端以div形式展现)和Inline(局部更新以span的形式展现在客户端)  子元素: 

    1,contentTemplate: 局部更新控件的内容模板,可以在其中添加任何控件 

    2,Triggers: 局部更新的触发器,包括两种:

    异步回发(AsyncPostBackTrigger) 用来实现局部更新。

    普通回发(PostBackTrigger)和普通的一养,不管是否使用了局部更新控件,都会引起页面的全部更新。

    二、下面是几个简单的例子:

    1、updatepanel的updatemode设置为always

    <%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default2.aspx.cs" Inherits="Default2" %> 
    <!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"> 
    <div> 
    </div> 
    <asp:ScriptManager ID="ScriptManager1" runat="server"> 
    </asp:ScriptManager> 
    <asp:UpdatePanel ID="UpdatePanel1" runat="server" UpdateMode="Always"> 
    <ContentTemplate> 
    <% =DateTime.Now.ToString()%> 
    <asp:Button ID="Button1" runat="server" Text="UpdatePanelButton" /> 
    </ContentTemplate> 
    </asp:UpdatePanel> 
    <asp:Button ID="Button2" runat="server" Text="Button" /> 
    </form> 
    </body> 
    </html>

    不管哪个按钮,都会触发更新,只不过外面的按钮postback的时候页面显示回发而已 ! 

    2、updatepanel的updatemode设置为conditional( ChildrenTriggers="false" 就是updatepanel中事件不触发更新)

    <%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default2.aspx.cs" Inherits="Default2" %> 
    <!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"> 
    <div> 
    </div> 
    <asp:ScriptManager ID="ScriptManager1" runat="server"> 
    </asp:ScriptManager> 
    <asp:UpdatePanel ID="UpdatePanel1" runat="server" UpdateMode="Always"> 
    <ContentTemplate> 
    <% =DateTime.Now.ToString()%> 
    <asp:Button ID="Button1" runat="server" Text="UpdatePanelButton" /> 
    </ContentTemplate> 
    </asp:UpdatePanel> 
    <asp:Button ID="Button2" runat="server" Text="Button" /> 
    </form> 
    </body> 
    </html>

    三、下面介绍下updatePanel的触发器Trigger 

    了解数据库的人应该对触发器这个概念比较清楚,Trigger对于UpdatePanel来说也是很关键的  开始简单介绍了UpdatePanel的俩中触发器asyncPostBackTrigger和PostBackTrigger的作用  这里用例子大概在稍微深入地介绍下:  1,普通回调触发器(PostBackTrigger)  PostBackTrigger主要针对UpdatePanel模板内的子控件,因为当子控件被触发时。它只会更新模版内的数据,模板外的控件不会发生变化.当需要更新全局 内容的时候就可以通过PostBackTrigger触发器来实现页面的全部回调。

    <%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default2.aspx.cs" Inherits="Default2" %> 
    <!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"> 
    <div> 
    </div> 
    <asp:ScriptManager ID="ScriptManager1" runat="server"> 
    </asp:ScriptManager> 
    <asp:UpdatePanel ID="UpdatePanel1" runat="server" UpdateMode="Always"> 
    <ContentTemplate> 
    <% =DateTime.Now.ToString()%> 
    <asp:Button ID="Button1" runat="server" Text="UpdatePanelButton" /> 
    </ContentTemplate> 
    <Triggers> 
    <!--下面的注释掉,点击updatePanel内的button则只更新Panel内的时间,取消注释责全部更新--> 
    <!-- <asp:PostBackTrigger ControlID="Button1"/>--> 
    </Triggers> 
    </asp:UpdatePanel> 
    <br /> 
    <% =DateTime.Now.ToString()%> 
    <asp:Button ID="Button2" runat="server" Text="Button" /> 
    </form> 
    </body> 
    </html>

    2,异步回调触发器(AsyncPostBackTrigger) 是实现局部更新的关键,在触发器内定义引起回发的控件和事件 

    <%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default2.aspx.cs" Inherits="Default2" %> 
    <!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"> 
    <div> 
    </div> 
    <asp:ScriptManager ID="ScriptManager1" runat="server"> 
    </asp:ScriptManager> 
    <asp:UpdatePanel ID="UpdatePanel1" runat="server" UpdateMode="Always"> 
    <ContentTemplate> 
    <% =DateTime.Now.ToString()%> 
    <asp:Button ID="Button1" runat="server" Text="UpdatePanelButton" /> 
    </ContentTemplate> 
    <Triggers> 
    <!--下面的注释掉,点击updatePanel内的button则只更新Panel内的时间,取消注释责全部更新--> 
    <!-- <asp:PostBackTrigger ControlID="Button1"/>--> 
    </Triggers> 
    </asp:UpdatePanel> 
    <br /> 
    <% =DateTime.Now.ToString()%> 
    <asp:Button ID="Button2" runat="server" Text="Button" /> 
    </form> 
    </body> 
    </html>

    运行了发现点击button2的时候只更新了 updatepanel内部的时间  上面的例子也可以动态更新UpdatePanel的一些源代码:  具体例子就不写了下面 大概写点主要代码:

    protected void Page_Load(object sender, EventArgs e) 

    //获取更新控件儿 
    UpdatePanel mapanel = UpdatePanel1; 
    //设置触发模式 
    mapanel.UpdateMode = UpdatePanelUpdateMode.Conditional; 
    //显示时间 
    Label1.Text = DateTime.Now.ToString(); 
    //添加触发 
    AsyncPostBackTrigger tri = new AsyncPostBackTrigger(); 
    tri.ControlID = "Button2"; 
    tri.EventName = "Click"; 
    mapanel.Triggers.Add(tri); 
    }

  • 相关阅读:
    .NET常见问题收集
    .NET 常用转换
    Android 百度地图开发setOnTouchListener方法给mapView设置了OnTouchListener后地图无法拖动的问题
    Android_参考
    常用操作
    Android开发笔记——Eclipse 关联Android源码
    Android开发笔记静态变量问题
    无法载入 mysql 扩展,<br />请检查 PHP 配置 解决办法
    服务器维护
    cocos2d 左下角三行
  • 原文地址:https://www.cnblogs.com/freeliver54/p/5685278.html
Copyright © 2011-2022 走看看