（转）MrXie 之Asp.Net Ajax系列(二) 局部页面呈现

MrXie 之 Asp.Net Ajax 系列 ( 二 )  局部页面呈现（ Partial-Page Rendering ）

MrXie

观察前面一篇文章的例子，你将在aspx页面的源代码发现<asp:UpdatePanel>和<asp:ScriptManager〉两个标签，这里我们将解释其局部页面呈现的概念。

局部页面呈现（Partial-Page Rendering）可以理解为局部页面加载，根据我们上一个例子，局部页面加载技术能够使得我们避免重新加载整个页面，它只更新我们需要刷新的部分，因此将大大减少用户等待时间，增强用户体验。上篇文章使用Microsoft Asp.Net 2.0 Ajax Extensions 组件，将使得我们不用写任何客户端javascript代码, 就可以使用这种技术。

Microsoft ASP.NET2.0 AJAX Extensions 使得我们能轻松扩展我们现有的asp.net 2..0应用程序，使得它能具备AJAX特性。我们可以在以下情况是用它：

•       极力提高用户的网页交互体验，增强响应感受，使得网页行为接近传统客户端程序。
• 减少整页刷新，避免反复刷新而产生的闪动。
• <!--[if !supportLists]--> <!--[endif]-->不必为兼容不同浏览器而编写客户端脚本
• <!--[if !supportLists]-->充分发挥AJAX的客户端与服务器通信特性，而不用编写任何客户端脚本
• <!--[if !supportLists]-->充分享受 ASP.NET AJAX Control Toolkit 的控件和组件的高效率
• <!--[if !supportLists]--> <!--[endif]-->开发自定义控件

局部页面呈现依赖于 ASP.NET 2.0 AJAX Extensions 的服务器端控件和在 Microsoft AJAX Library 中的客户端功能。在应用的过程中并不要求你使用 Microsoft AJAX Library ，因为它的功能将在你使用服务器端控件的时候自动提供。当然，你也可以直接调用该库的开放 API, 去开发具备其他的 AJAX 特性的网页。

Partial-Page Rendering的基本特征包含：

<!--[if !supportLists]--><!--[endif]--> 像 Asp.net 服务器控件一样的声明模型。在很多情况下，你仅仅声明一个标签就可以定制局部页面呈现。

• <!--[if !supportLists]-->  <!--[endif]--> 拥有服务器端控件，包含 ScriptManager 和 UpdatePanel 控件。
• <!--[if !supportLists]-->  <!--[endif]--> 服务器端控件和 Microsoft AJAX Library 集成，为普通任务提供实现类似取消 postback 或决定多次点击后如何运行的能力
• <!--[if !supportLists]--><!--[endif]--> 错误处理机制能使你将错误自定义的显示在浏览器里。
• <!--[if !supportLists]-->  <!--[endif]--> 跨浏览器的兼容性已经融入 Microsoft AJAX Library. 易于使用的服务器控件将自动调用匹配适合浏览器的功能

背景

使用ASP.Net服务器控件的典型网页能够通过已被初始化的用户行为完成提交，比如说点击一个按钮。在响应流中，服务器将呈现一个新网页。在很多情况下，完全没有必要在提交之间重新呈现那些没有任何改变的控件和文本。

使用 ASP.NET AJAX 局部页面呈现技术，你只需要更新一个网页中的独立区域部分 ，使得其对用户有更好的响应性。你可以使用 ASP.NET 的服务器控件，也可以写客户端脚本来调用 Microsoft AJAX Library 中的 API 来实现局部页面呈现。

服务器端控件

 

想要在ASP.NET网页上实现AJAX功能，你必须标识一个需要更新的独立区域。于是你需要使用UpdatePanel控件来进行包装该区域，里面可以放HTML也可以是ASP.NET控件。你可以在网页Design视图下从工具栏将其拖入，也可以使用在Source视图中以声明标签的方式实现。就像下面

<asp:UpdatePanel ID="UpdatePanel1" runat="server">

    <ContentTemplate>

        <!-- Place updatable markup and controls here. -->

    </ContentTemplate>

</asp:UpdatePanel>

在上一个篇的例子里，你如果察看源文件，也将会看到这个标签。

所有包含自这个update panel 内的控件所引发的提交都会在默认情况下自动以异步的方式执行，使得该区域能够实现局部页面的更新。你也可以指定一个update panel区域以外的一个控件去引发该区域的提交和刷新，也就意味着你可以指定某个控件作为其触发器。关于这部分内容我们将在以后会提到。

当异步提交就像一次普通的提交在服务器的页面事件中发生的时候， ViewState 和 Form 的数据将被保存下来。然而，除了在 updatePanel 中的内容会在客户端浏览器更新，其余的将保持原状。

为了实现局部页面呈现，你还有一件事情要做，就是放置一个 ScriptManager 控件在页面上。 ScriptManager 控件自动跟踪页面上所有的 update panel ，同时也充当着他们的触发器， 调整服务器局部页面呈现的行为，指示页面的某个部分作为最近一次异步提交的显示结果。

放在 form 标签中即可

<asp:ScriptManager ID="ScriptManager1" runat="server" EnablePartialRendering="true" />

局部页面呈现的缺陷

如果局部页面呈现失效或者浏览器不支持，那么提交将变得和任何普通ASP.Net网页一样，异步提交行为将被同步提交和整页更新所替代，UpdatePanel控件将失效，控件里的内容就象没有放在里面一样。

后面我将讲解UpdatePanel具体使用的例子

下一篇：MrXie 之Asp.Net Ajax系列(三)UpdatePanel使用初步。