Asp.net中UpdatePanel的用法详解

Asp.net UpdatePanel 允许用户构建一个丰富的,以客户端为中心的应用程序,引用UpdatePanel控件,能够实现页面的部分刷新,一个包含scriptManage和 UpdatePanel控件的页面自动具有页面部分刷新的功能,不需要写任何的客户端JavaScript代码。一个web页面只能包含一个 ScriptManage控件,但可以包含一个或多个UpdatePanel控件。

使用UpdatePanel控件实现页面的局部更新,需要包含一个ScriptManage控件,并且必须将ScriptManage控件的 EnablePartialRendering属性设置为true,不过你不用担心,该属性的默认值就是True,所以,在默认情况下,只要添加了 ScriptManage控件,该页面就自动具有了局部更新的能力。

一、UpdatePanel的结构

<asp:ScriptManager runat="server" > </asp:ScriptManager> <asp:UpdatePanel 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 runat="server"> <div> </div> <asp:ScriptManager runat="server"> </asp:ScriptManager> <asp:UpdatePanel runat="server" UpdateMode="Always"> <ContentTemplate> <% =DateTime.Now.ToString()%> <asp:Button runat="server" Text="UpdatePanelButton" /> </ContentTemplate> </asp:UpdatePanel> <asp:Button 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 runat="server"> <div> </div> <asp:ScriptManager runat="server"> </asp:ScriptManager> <asp:UpdatePanel runat="server" UpdateMode="Conditional" ChildrenAsTriggers="false"> <ContentTemplate> <% =DateTime.Now.ToString()%> <asp:Button runat="server" Text="UpdatePanelButton" /> </ContentTemplate> </asp:UpdatePanel> <asp:Button runat="server" Text="Button" /> </form> </body> </html>

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

了解数据库的人应该对触发器这个概念比较清楚,Trigger对于UpdatePanel来说也是很关键的
开始简单介绍了UpdatePanel的俩中触发器asyncPostBackTrigger和PostBackTrigger的作用
这里用例子大概在稍微深入地介绍下:

1,普通回调触发器(PostBackTrigger)

PostBackTrigger主要针对UpdatePanel模板内的子控件,因为当子控件被触发时。它只会更新模版内的数据,模板外的控件不会发生变化.当需要更新全局 内容的时候就可以通过PostBackTrigger触发器来实现页面的全部回调。

内容版权声明:除非注明,否则皆为本站原创文章。

转载注明出处:https://www.heiqu.com/zyfdgg.html