实现页面异步局部更新-Ajax updatepanel控件

         优化系统，是因为系统的不够完善，同时也是为了软件的可持续发展。开发软件的同志们，应该都有同感，优化比开发难，但是无可厚非的是，优化比开发重要。

 

        本着这么一项宗旨，我在优化自己那一个功能模块时，不得不走上了“更快更好更实用”的路子，其中用到了一些技术和技巧性的东西，愿意拿出来分享给大家，会以博客的方式陆续发表出来，希望大家多提宝贵意见！

 

        因为某种原因，需要用到页面局部更新，采纳别人的意见，用现在很火的AJAX来实现。

 

一、简单介绍控件和相关属性

 

 ScriptManager控件

属性:EnablePartialRendering属性：true-实现页面的异步局部更新;false-实现全页面的刷新。

 

UpdatePanel控件

属性：

UpdateMode属性：Always-UpdatePanel页面上任何一处发生的回发操作都会产生页局部更新;Conditional-只在特定的情况下才产页面的回发，如执行UpdatePanel控件的update()方法或在指定的触发器的操作下。

ChildAsTrigger属性：指示UpdatePanel内部控件引起的回发是否产生当前UpdatePanel控件的局部更新。如果UpdateMode设为Always的话，那ChildAsTrigger局性必须设为True，否则运行出错

RenderMode属性：InLine-UpdatePanel控件被解析成HTML的<span>标记;Block-UpdatePanel控件被解析成HTML控件的<DIV>

 

二、介绍两种局部更新的方法

 

1、updatepanel控件的内部控件（假设该控件为Button1）引起局部更新时：

 

a、首先在页面放入ScriptManager控件，放在Form里即可，设置EnablePartialRendering属性，详情见下面代码：

 

              <!--局部刷新-->              <asp:ScriptManager ID="ScriptManager1"runat="server" EnablePartialRendering="true" >              </asp:ScriptManager>

b、将需要更新的内容放在UpdatePanel控件里，详情见下面代码：

 

     <%--局部刷新，UpdatePanel的元素ContentTemplate是更新面板的内容模板--%>     <asp:UpdatePanelID="UpdatePanel1" runat="server"ChildrenAsTriggers="True" UpdateMode="Always" >         <ContentTemplate>             需要更新的内容，button1（点击这个按钮，开始更新）         </ContentTemplate>     </asp:UpdatePanel>

         

c、运行页面即可。

 

2、updatepanel控件的外部控件（假设该控件为Button1）引起局部更新时：

 

a、刚开始的内容与上面一样，不同的是，需要将UpdatePanel的属性UpdateMode设为Conditional；

 

b、我们要在Page_Load方法中注册ScriptManager1.RegisterAsyncPostBackControl()来注册一下要实现异步更新的控件，详情见下面代码：

         //实现对Button1的注册         ScriptManager1.RegisterAsyncPostBackControl(this.Button1);

c、在Button1控件的Click事件中后面加入相应代码，使得Button1按钮只对UpdatePanel1控件实现的异步的局部刷新，详情见下面代码：

             UpdatePanel1.Update();

d、运行页面即可。