asp.net UpdatePanel的简单用法- ASP.NET - 软晨网（RuanChen.com）

当前位置: 首页 > 图文教程 > 网络编程 > ASP.NET > asp.net UpdatePanel的简单用法

ASP.NET: asp.net GridView控件中模板列CheckBox全选、反选、取消; asp.net GridView 删除时弹出确认对话框(包括内容提示); asp.net DropDownList 三级联动下拉菜单实现代码; asp DataTable添加列和行的三种方法; Asp.net 页面调用javascript变量的值; asp.net 长文章通过设定的行数分页; asp.net 定时间点执行任务的简易解决办法; asp.net 页面延时五秒，跳转到另外的页面; asp.net 动态输出透明gif图片; asp.net DataList与Repeater用法区别; asp.net Javascript获取CheckBoxList的value; asp.net程序在调式和发布之间图片路径问题的解决方法; asp.net下生成英文字符数字验证码的代码; asp.net 页面版文本框智能提示JSCode (升级版); ASP.NET URL伪静态重写实现方法; ASP.NET 2.0 中Forms安全认证; asp.net 动态添加多个用户控件; asp.net Repeater显示父子表数据,无闪烁; asp.net 无法获取的内部内容，因为该内容不是文本的解决方法; asp.net GridView排序简单实现

No. « ‹ 167 168 169 170 › »

技术文章搜索

关键字

ASP.NET 中的 asp.net UpdatePanel的简单用法

出处:互联网 整理: 软晨网（RuanChen.com） 发布: 2009-09-13 浏览: 279 ::

收藏到网摘: n/a

asp.net Gridview里添加汇总行 asp.net ajaxControlToolkit FilteredTextBoxExtender的简单用法

局部更新是ajax技术的最基本，也是最重要的用法，今天大概把asp.net ajax中的局部更新控件 updatepanel的用法记录下，大家可以共同探讨 UpdatePanel控制页面的局部更新，这个更新功能依赖于scriptManger控件的EnablePartialRendering属性，如果这个属性设置为false局部更新会失去作用(scriptManger控件的EnablePartialRendering属性的默认值为true不必刻意去设置)
下面是一个完整的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的时候页面显示回发而已！
1,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="Conditional" ChildrenAsTriggers="false"> 
<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"> 
<asp:ScriptManager ID="ScriptManager1" runat="server"> 
</asp:ScriptManager> 
<asp:UpdatePanel ID="UpdatePanel1" runat="server" UpdateMode="Always"> 
<ContentTemplate> 
<% =DateTime.Now.ToString()%> 
</ContentTemplate> 
<Triggers> 
<asp:AsyncPostBackTrigger ControlID="Button2" EventName="Click" /> 
</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); 
} 

先记录这些~还望多多大虾们多多指教

asp.net Gridview里添加汇总行 asp.net ajaxControlToolkit FilteredTextBoxExtender的简单用法

ASP.NET 中的 asp.net UpdatePanel的简单用法

评论 (0) All