updatePanle总结

总是在觉得不是问题的问题上牵绊住，基础才是王道啊。。。。。

一、UpdatePanel内部的控件引起的回发，来更新当前UpdatePanel内部的控件内容： 在ASPX中代码如下：

<form id="form1" runat="server"><asp:Label ID="lbl_PageLoad" runat="server" Text="Label"></asp:Label> <asp:ScriptManager ID="sm1" runat="server"></asp:ScriptManager><div><asp:UpdatePanel ID="up1" runat="server" ChildrenAsTriggers="true"><ContentTemplate><asp:Label ID="lbl_Update" runat="server"></asp:Label><br /><asp:Button ID="btn1" runat="server" OnClick="btn_Click" Text="Test" /></ContentTemplate></asp:UpdatePanel></div></form>

在cs中代码如下：

protected void Page_Load(object sender, EventArgs e) { lbl_PageLoad.Text = DateTime.Now.ToString(); }
protected void btn_Click(object sender, EventArgs e) { lbl_Update.Text = DateTime.Now.ToString(); }

运行显示效果如下：
点击Test按钮，显示效果如下： 再次点击Test按钮，显示效果为：
可以看到，每次点击Test按钮时，第一行的时间都没有改变。第二行的时间就变化为当前时间。因为第一行的时间是在Page_Load中设置的，而每次点击Test按钮时，就会局部刷新第二行的时间。即刷新UpdatePanel中的控件。页面其余部分的控件并不刷新。
注意：此时的ScriptManager的EnablePartialRendering属性应设为true。UpdatePanel的UpdateMode属性应设为Always。ChildAsTrigger属性应设为true。
二、UpdatePanel控件外部的控件来异步更新UpdatePanel内部的内容： 虽然上面的方式能够达到我们更新局部控件的要求，但大多数时候，我们是将需要局部更新的控件放在UpdatePanel中，而将引发更新的控件放在UpdatePanel的外面。
在页面中加入一个新的UpdatePanel，如下所示：

<asp:UpdatePanel ID="upExternal" runat="server" UpdateMode="Always"> <ContentTemplate> <asp:Label ID="lbl_TestExternal" runat="server" Text="Test External"></asp:Label> </ContentTemplate> </asp:UpdatePanel>   <asp:Button ID="btnExternal" runat="server" OnClick="btnExternal_Click" Text="Test External" />

在CS的Page_Load中加入下列代码：

protected void Page_Load(object sender, EventArgs e) { lbl_PostBack.Text = DateTime.Now.ToString(); sm1.RegisterAsyncPostBackControl(btnExternal); //实现对btnExternal的注册，那此时btnExternal的回发就变成一个异步回发（页面不会刷新），如果页面上的UpdatePanel的UpdateMode="always",里面的内容的就会被刷新。若为Conditional，则不会刷新。 }

在cs中添加button的click响应函数：

protected void btnExternal_Click(object sender, EventArgs e) { lbl_TestExternal.Text = DateTime.Now.ToString(); }

运行效果如下：
点击Test External按钮，运行效果如下： 再次点击Test External按钮，下面一行的时间不断改变：
即每次点击UpdatePanel外部的Button时，都会局部刷新UpdatePanel里的控件。 注意：此时的ScriptManager的EnablePartialRendering属性应设为true。UpdatePanel的UpdateMode属性应设为Always。
三、针对特定UpdatePanel控件进行异步更新把页面上所有的UpdatePanel控件的UpdateMode设为Conditional,如下所示：

<form id="form1" runat="server"> <asp:Label ID="lbl_PostBack" runat="server" Text="Label"></asp:Label>   <asp:ScriptManager ID="sm1" runat="server" EnablePartialRendering="true"></asp:ScriptManager> <div> <asp:UpdatePanel ID="up1" runat="server" ChildrenAsTriggers="true" UpdateMode="Conditional"> <ContentTemplate> <asp:Label ID="lbl_Update" runat="server"></asp:Label> <br /> <asp:Button ID="btn1" runat="server" OnClick="btn_Click" Text="Test" /> </ContentTemplate> </asp:UpdatePanel> <br /> <asp:UpdatePanel ID="upExternal" runat="server" UpdateMode="Conditional"> <ContentTemplate> <asp:Label ID="lbl_TestExternal" runat="server" Text="Test External"></asp:Label> </ContentTemplate> </asp:UpdatePanel>   <asp:Button ID="btnExternal" runat="server" OnClick="btnExternal_Click" Text="Test External" /> </div> </form>

在后台cs中加入如下代码：

protected void Page_Load(object sender, EventArgs e) { lbl_PostBack.Text = DateTime.Now.ToString(); sm1.RegisterAsyncPostBackControl(btnExternal); }
protected void btn_Click(object sender, EventArgs e) { lbl_Update.Text = DateTime.Now.ToString(); }
protected void btnExternal_Click(object sender, EventArgs e) { lbl_TestExternal.Text = DateTime.Now.ToString(); up1.Update(); }

运行效果如下：
不管如何点击Test External按钮，"Test External"文字都没有变成当前时间。因为我们加入了up1.Update();表示仅仅刷新up1,不刷新lbl_TestExternal所在的upExternal。 如果修改cs代码为：

protected void btnExternal_Click(object sender, EventArgs e) { lbl_TestExternal.Text = DateTime.Now.ToString(); upExternal.Update(); }

显示效果如下：
每次点击Test External按钮，最后那行的时间都会随着改变。
注意：这里的UpdatePanel的属性要设为Conditional，如果还是Always的话，会出现所有的UpdatePanel都刷新的效果。
四、用Trigger触发器来局部更新UpdatePanel这里的效果和上面二、三局部更新UpdatePanel的效果一致，只是变换了一种实现方式而已。 上面的方法是这样的： 在cs的Page_Load中用ScriptManager的RegisterAsyncPostBackControl来注册一个控件（如btnExternal) 现在我们在ASPX中用Triggers来注册这个控件。部分代码如下：

<asp:UpdatePanel ID="upExternal" runat="server" UpdateMode="Conditional"> <ContentTemplate> <asp:Label ID="lbl_TestExternal" runat="server" Text="Test External"></asp:Label> </ContentTemplate> <Triggers> <asp:AsyncPostBackTrigger ControlID="btnExternal" EventName="Click" /> </Triggers> </asp:UpdatePanel> <asp:Button ID="btnExternal" runat="server" OnClick="btnExternal_Click" Text="Test External" />

这个效果和上面二、三效果一样，这里就不重复列出效果图片了。 注意：把所有的UpdatePanel控件的ＵpdateMode设为"Conditional"，这样才能够针对建有相关触发器的UpdatePanel更新。一个UpdatePanel上可以建有多个触发器，实现在不同的情况下对该UpdatePanel控件内容的更新。
五、用不同的控件来触发不同的UpdatePanel的局部更新这其实是对四的一个延伸。用一个按钮来控制UpdatePanel1的更新，用另一个按钮来控制UpdatePanel2的更新。废话少说，完整代码如下：

<form id="form1" runat="server"> <asp:Label ID="lbl_PostBack" runat="server" Text="Label"></asp:Label>   <asp:ScriptManager ID="sm1" runat="server" EnablePartialRendering="true"></asp:ScriptManager> <div> <asp:UpdatePanel ID="up1" runat="server" ChildrenAsTriggers="true" UpdateMode="Conditional"> <ContentTemplate> <asp:Label ID="lbl_Update" runat="server"></asp:Label> </ContentTemplate> <Triggers>
<asp:AsyncPostBackTrigger ControlID="btn_up1" EventName="Click" />
</Triggers> </asp:UpdatePanel>   <asp:Button ID="btn_up1" runat="server" OnClick="btnUp1_Click" Text="Test External 1" /> <br /> <asp:UpdatePanel ID="upExternal" runat="server" UpdateMode="Conditional"> <ContentTemplate> <asp:Label ID="lbl_TestExternal" runat="server" Text="Test External"></asp:Label> </ContentTemplate> <Triggers>
<asp:AsyncPostBackTrigger ControlID="btnExternal" EventName="Click" />
</Triggers> </asp:UpdatePanel>   <asp:Button ID="btnExternal" runat="server" OnClick="btnExternal_Click" Text="Test External 2" /> </div> </form>

后台完整代码如下：

protected void Page_Load(object sender, EventArgs e) { lbl_PostBack.Text = DateTime.Now.ToString(); //sm1.RegisterAsyncPostBackControl(btnExternal); }
protected void btnUp1_Click(object sender, EventArgs e) { lbl_Update.Text = DateTime.Now.ToString(); }
protected void btnExternal_Click(object sender, EventArgs e) { lbl_TestExternal.Text = DateTime.Now.ToString(); //upExternal.Update(); }

运行效果如下：
点击Test External 1按钮，显示效果如下：
点击Test External 2按钮，显示效果如下： 每次点击这两个按钮，对应的时间都会发生改变：

即实现了不同控件控制不同的UpdatePanel的局部更新。可以看到最顶部那个时间值就一直不变，也就是局部更新不影响其他控件的值。
几个重要的属性： ScriptManager控件的EnablePartialRendering属性：

true-实现页面的异步局部更新; false-实现全页面的刷新。

UpdatePanel控件的RenderMode属性：

InLine-UpdatePanel控件被解析成HTML的<span>标记; Block-UpdatePanel控件被解析成HTML控件的<DIV>。

UpdatePanel 控件的UpdateMode属性：

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

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

最后如果控件在updatepanel 外，想更新updatepanel的同时顺便更新控件外的内容，可以再后端注册脚本，如果直接写在click事件里面不起作用。。。。切记，切记

原因很简单，本来UPDATEPANEL就是局部更新，你把控件放在外面当然不会更新了，此时

 ScriptManager.RegisterStartupScript(UpdatePanel2, this.GetType(), "alert", function, true);
就起作用了.