Atlas讲座（1）－ UpdatePanel控件

1. 前言

随着AJAX技术日益成熟，B/S桌面化的进程加快，市面上涌现出一大批AJAX控检，在众多控件中ATLAS控检是最受程序员喜欢的一种，下面我们就对ATLAS做初步的了解。

2. UpdatePanel控件

a) UpdatePanel 是ASP.NET Atlas 中很重要的一个控件。它把传统的ASP.NET 程序与最新的Web 2.0 AJAX无缝的连接在一起。如果你已经有一些基于ASP.NET 的网站，UpdatePanel 可以让你通过很小的修改轻松的实现AJAX。如果你并不很熟悉AJAX 相关的技术比如JavaScript/DOM 等，UpdatePanel 更是可以让你不用书写一行客户端脚本而实现酷酷的AJAX 应用。所需要的就是把需要动态更新的部分放置于一个UpdatePanel 中，这一点与MagicAjax Framework 有着异曲同工之妙。

b) 使用UpdatePanel步骤：

用ASP.NET 实现你的设计，此刻你并不需要考虑任何有关AJAX 的问题，就像普通的ASP.NET 程序一样。

在页面上添加一个ScriptManager 对象，并设定属性EnablePartialUpdates=true

将你希望动态更新的部分用UpdatePanel 包围起来

为你添加的UpdatePanel 设定Event Trigger

只要这些步骤就够了，不需要考虑XMLHTTPRequest 或者ActiveX 对象，也不需要书写客户端的脚本或者

考虑如何与服务器通信，所有的细节，Atlas 已经为你做好了

c) Atlas UpdatePanel 的实现原理

浏览器如同普通PostBack 一样Post 回服务器，服务器处理后再次

发送给浏览器，这个过程就和传统的页面模型一样。但到达客户端时ScriptManager 只更新位于

UpdatePanel 中的内容和ViewState

d) 使用UpdatePanel 中应该注意的几个问题

必须指定ScriptManager 中的属性EnablePartialUpdates=true，这样ScriptManager 才会将普通的

PostBack 转化为对服务器的异步调用，也就是AJAX 的方法。否则页面只会与传统的ASP.NET 一样刷新。

其次，UpdatePanel 提供两种引发异步PostBack 的Trigger：

• ControlValueTrigger：当某个控件的某个指定的属性变化时更新。例如：ControlID="dropDownList1"

PropertyName="SelectedValue"

• ControlEventTrigger：当某个控件发出指定事件时更新。例如：ControlID="button1"

EventName="Click"

最后，每个UpdatePanel 都有两种更新的方式：

• Always：每次AJAX PostBack 或是普通PostBack 的时候都会更新该Panel 的内容

• Conditional：只有满足如下某一条件时才更新该Panel 的内容：

1. 当Panel 中的某个控件引发了PostBack 时

2. 当Panel 所指定的某个Trigger 被引发时

Atlas 学习指南 Dflying http://dflying.cnblgos.com

3. 当Panel 的Update()方法在Codebehind 中被调用时

e) UpdatePanel 服务器控件使用技巧

1. 务必设定ScriptManager 的EnablePartialRendering 属性为true。有好多人向我抱怨说他

们的UpdatePanel 并不以AJAX 的方式工作而还是引发普通的整页PostBack，原因就在于没有设

定这个属性。

2. 设定触发UpdatePanel 的控件为服务器控件。因为无论ControlValueTrigger 还是

ControlEventTrigger，指定的属性/事件都是服务器端属性/事件，都只在服务器端属性变化或

是服务器端发出事件时才能触发UpdatePanel 的PostBack。

3. 区别UpdatePanel的两种更新方式：Always和Conditional。请参考：

http://dflying.cnblogs.com/archive/2006/03/25/358547.html。我们应该设定正确的更新方

式以避免更新不必要更新的Panel，造成不必要的性能/网络开销。

4. 不要只使用UpdatePanel。如果你从头开始建立一个Atlas 程序，仅仅使用UpdatePanel 来实现

AJAX 可能并不是最好的选择。UpdatePanel 仅仅简单的从头渲染所有的位于ContentTemplate

内部的控件，在某些情况下可能非常低效，例如，对于一个包含了一个有相当多结点的TreeView 控

件的UpdatePanel 来说，如果你只是想简单的添加一个新节点，使用UpdatePanel 将会从后台取

得整个TreeView 并重新渲染，远不及仅存储后并把这个新的节点添加到TreeView 中来得高效。在

这些情况下，你最好考虑使用一些较高级的Atlas 客户端控件。当然，这也加大了一些开发的难度。

5. 在页面的InitComplete 事件被引发前必须保证UpdatePanel 已经被初始化。也就是说，不能

将UpdatePanel 放置于比如一个DataList 的HeaderTemplate 中，因为HeaderTemplate 中的

内容是在Databinding 时期才得到的，而这时页面的InitComplete 事件早已经结束。

6. 在UpdatePanel 中不要使用Response.Write(); 。这会扰乱UpdatePanel 的执行过程。

7. Atlas 的客户端脚本可以使用于任何的开发平台/语言中。例如ASP.NET 1.1，纯HTML 甚至PHP，

但是像UpdatePanel 这样的服务器端控件只能用于ASP.NET 2.0 页面中。Atlas 的客户端脚本实际

上就是一些经过组织的JavaScript 文件，当然是与服务器端选用的技术无关的。但当你使用非

ASP.NET 2.0 环境时，需要手动加入对这些JavaScript 文件的引用，因为你无法使用ASP.NET 2.0

中的服务器端控件ScriptManager。

8. 小心在UpdatePanel 中包含第三方JavaScript 实现的组件。开发跨平台的JavaScript

Framework 是一件很艰巨的任务，在目前的Atlas 实现中仍有很多兼容性的问题。让我们期待未来

会更好或者干脆现在想办法自己解决吧。

9. 在页面上添加一个且只添加一个UpdateProgress 控件。UpdateProgress 控件应当是一个全局

的控件，所有的AJAX 操作都会自动地由UpdateProgress 控件来处理。想象一下如果Gmail 一下

子显示了好多个Loading 提示，用户一定会不知所措吧。

10. 在UpdateProgress 的Template 中有一个magic ID：abortButton，你可以提供一个服务器

端Button 或者LinkButton 控件并指定ID 为abortButton，使用户可以取消当前执行的AJAX 请

求。当然，使用magic ID 并不是一个好的设计方法，相信在未来的版本中这个magic ID 会被一个

类似<CancelTemplate>的东西取代。当然，在当前的Atlas 版本中，请记住abortButton。