1 概述
ASP.NET UpdatePanel 控件能让你创建丰富的、以客户为中心的 Web 应用程序。使用 UpdatePanel 控件,可以刷新选择的页面部分而不是使用回发来刷新整个页面,这就像是执行了一个局部页面更新一样。包含一个 ScriptManager 和一个或多个 UpdatePanel 的 Web 页面会自动加入局部页面更新,而不需要定制客户端代码。
1.1 场景
UpdatePanel 是一个服务器控件,可以帮助你开发使用复杂客户端行为的 Web 页面,使 Web 页面呈现更多的交互给用户。服务器和客户端之间协调以仅更新指定的页面部分通常需要很深的 ECMAScript(Javascript)知识。然而,通过使用UpdatePanel 控件,可以不用编写任何客户端脚本就可以给页面加入局部页面更新。如果你愿意,可以添加定制的客户端脚本以增强客户端用户体验。在使用 UpdatePanel 控件时,页面行为是独立于浏览器的,并且潜在的减少了客户端和服务器的数据传输量。
1.2 背景
UpdatePanel 的工作是指定无须刷新整个页面就可以更新的区域,这个过程由 ScriptManager 服务器控件和客户端 PageRequestManager 类进行协调。当局部更新可用时,控件可以异步的发送到服务器。异步回发的行为和常规回发一样,结果服务器页面会执行完整的页面和控件生命周期。然而,使用异步回发,页面更新仅限于封闭在 UpdatePanel 控件中标记为更新的页面区域。服务器仅为受影响的元素发送 HTML 标记到浏览器。在浏览器中,客户端 PageRequestManager 类执行文档对象模型 ( DOM ) 操作用更新的标记替换得已有的 HTML 。下面的图例展示了页面的第一次加载,和后来的刷新 UpdatePanel 控件的内容的异步回发。
2 UpdatePanel 的使用
要使用 UpdatePanel 控件可用,必须设置 ScriptManager 的 EnablePartialRendering 属性为 true 。
UpdatePanel 控件可以输出为 <div> 元素或 <span> 元素,以在页面中形成一个块或内联的区域,可以设置其 RenderMode 属性为 Block ( 默认,<div>)或 Inline ( <span> ) 来指定。
2.1 指定 UpdatePanel 的内容
可以使用 ContentTemplate 属性以声明的方式或者在设计器中添加内容到 UpdatePanel 控件中。在标记中,这个属性显示为 <ContentTemplate> 元素。如果要以编程的方式添加内容,可以使用 ContentTemplateContainer 属性。
包含一个或多个 UpdatePanel 控件的页面在第一次输出时,所有 UpdatePanel 控件中的内容都会被输出并被发送到浏览器。在后来的异步更新中,单个 UpdatePanel 控件中的内容可能会被更新。更新依赖于面板的设置、导致回发的元素以及指定给每个面板的代码。
2.2 指定 UpdatePanel 的触发器
触发器由在 UpdatePanel 控件的 <Triggers> 元素中的 <asp:AsyncPostBackTrigger> 元素定义。(如果是在 Visual Studio 中编辑页面,就可以在 UpdatePanel 的属性面板中单击 Triggers 属性后面的省略号按钮打开一个 UpdatePanelTrigger 集合编辑器对话框来创建触发器。)触发器必要的属性是 ControlID ,用它来指定可以导致面板更新的控件的 ID 。
有上例中,虽然按钮没有声明在面板中,但是由于在面板中指定了它为触发器,所以当按钮事件触发时,会产生其被包含中面板中同样的结果,即面板被更新。
触发器控件的事件是可选的,如果没有指定事件,触发器将使用控件的默认事件。例如,对于 Button 控件,默认事件就是 Click 事件。
2.3 在母版页中使用 UpdatePanel
要在母版页中使用 UpdatePanel 控件,必须确定如何使用 ScriptManager 控件。如果在母版页面中放置了一个 ScriptManater 控件,则 ScriptManager 控件可以在所有的内容面中起作用。(如果要在内容页中声明脚本或服务,可以在页面中添加一个 ScriptManagerProxy,它具有和 ScriptManager 差不多一样的属性和方法。)
如果在母版页中没有包含 ScriptManager 控件,就必须在包含 UpdatePanel 控件的每个内容页是都要放置一个 ScriptManager 控件,设计的选择依赖于在应用程序中将如何管理客户端脚本。
如果在母版页中包含了 ScriptManager 控件,而在某个内容页中又不打算使用局部页面输出的功能时,必须用程序设置内容中的 ScriptManager 控件的 EnablePartialRendering 为 false 。
2.4 使用嵌套的 UpdatePanel 控件