在ASP.NET AJAX 机制中,UpdatePanel 有着相当重要的地位,它让开发人员不用撰写 AJAX 相关程式码,就能享有 AJAX 的效果。一般包含在 UpdatePanel 中的子控制项,若子控制项有执行 PostBack 动作时,UpdatePanel 机制在前端会去拦截 __doPostBack 函式,使得控制项产生的 PostBack都会经由 UpdatePanel 统一处理局部更新的动作。
可是有时我们会需要透过 JavaScript 要求 UpdatePanel 做更新的动作,一般都会以为直接呼叫 __doPostBack 即可。以下以一个实例来做测试,我们在页面的 UpdatePanel 放置一个 Label 来显示最新时间。然後 Input (type=button)在 onclick 直接呼叫 __doPostBack 函式。
*.aspx
1 <asp:ScriptManagerID="ScriptManager1"runat="server"/>
2 <div>
3 <asp:UpdatePanelID="UpdatePanel1"runat="server">
4 <ContentTemplate>
5 ServerTime:
6 <asp:LabelID="Label1"runat="server"Text="Label"></asp:Label>
7 </ContentTemplate>
8 </asp:UpdatePanel>
9 <inputid="Button1"type="button"value="button"onclick="__doPostBack('','');"/>
10 </div>
*.aspx.vb
1 ProtectedSubPage_Load(ByValsenderAsObject,ByValeAsSystem.EventArgs)HandlesMe.Load
2 Label1.Text=Now.ToString()
3 EndSub
可是实际执行并不如预期,UpdatePanel 中的时间是更新了,可是页面会产生闪烁的情形,这个 PostBack 并不会受 UpdatePanel 控管。
其实只要做一点修改就可以要求 UpdatePanel 做更新的动作,就是在 __doPostBack 函式的第一个引数 (eventTarget),如下范例传入 UpdatePanel 的 ClientID 即可。实际执行的结果页面就不会再闪烁了,因为 PostBack 动作已经在 UpdatePanel 的控管中。
<inputid="Button1"type="button"value="button"onclick="__doPostBack('UpdatePanel1','');"/>
UpdatePanelRefresh.rar下载:http://file.ddvip.com/2008_10/1224665246_ddvip_5201.rar