本文转自: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); 
}

最新文章

  1. rem、em、px的区别
  2. Could not find class &#39;android.support.v4.view.ViewPager&#39;, referenced from me
  3. css布局课件
  4. NOIP2009 最优贸易
  5. javascript设计模式3
  6. 【转载】va_list 可变参数 简介 va_copy vprintf
  7. windows 7 下安装 IIS 和 ArcGis Server 9.3 遇到的问题及解决方法
  8. 为Activity设置特定权限才能启动
  9. PHP获取每月第一天与最后一天
  10. 第一周作业.四则运算生成器(基于python)
  11. 2017 ICPC 广西邀请赛1004 Covering
  12. Python 3 函数自由变量的大坑
  13. [文摘]Quick Start to Client side COM and Python
  14. SQL ROUND() 函数
  15. 什么是车辆识别代码(VIN)
  16. Spring Boot学习记录02_构建SpringBoot工程_通过idea构建
  17. 2018牛客网暑假ACM多校训练赛(第七场)I Tree Subset Diameter 动态规划 长链剖分 线段树
  18. form表单提交注意事项
  19. CS229笔记:分类与逻辑回归
  20. HAOI2017 新型城市化 二分图的最大独立集+最大流+强连通缩点

热门文章

  1. 如何使用递归遍历对象获得value值
  2. VS2012 asp.net mvc 4 运行项目提示:&quot;错误消息 401.2。: 未经授权: 服务器配置导致登录失败&quot;
  3. iOS UISlider的使用
  4. 解决ReSharper自动删除换行
  5. JS常用的function集合
  6. 之二:CAKeyframeAnimation - 关键帧动画
  7. 100个高质量Java开发者博客
  8. 通过settings.db自定义Android系统默认设置
  9. 干货之UIButton的title和image自定义布局
  10. self&amp;super