使用JavaScript控制UpdatePanel的更新

在 ASP.NET AJAX 机制下，使用 UpdatePanel 控件有很好的用户体验，它可以让开发人员不用编写繁杂的 javascipt相关程序代码，就能享有 AJAX 的效果。一般包含在 UpdatePanel 中的子控件，如果子控件有执行 PostBack 操作时，UpdatePanel 的机制在前端会拦截 __doPostBack 操作，使得控件产生的 PostBack 都会经由 UpdatePanel 统一处理，以做到局部更新的效果。

可是有时候我们会需要透过 JavaScript 要求 UpdatePanel 做更新的操作，一般都会以为直接呼叫 __doPostBack 即可。

以一个实例来做测试，我们在页面的 UpdatePanel 放置一个 Label 来显示最新时间。然后通过HTML控件 Input (type=button) 在 onclick 直接调用 __doPostBack 事件函数。

         < asp:ScriptManager  ID ="ScriptManager1"  runat ="server"   />
         < div >
             < asp:UpdatePanel  ID ="UpdatePanel1"  runat ="server" >
                 < ContentTemplate >
                    Server Time:
                     < asp:Label  ID ="Label1"  runat ="server"  Text ="Label" ></ asp:Label >
                 </ ContentTemplate >
             </ asp:UpdatePanel >
             < input  id ="Button1"  type ="button"  value ="button"  onclick ="__doPostBack('','');"   />
         </ div >

protected   void  Page_Load( object  sender, EventArgs e)
    {
        Label1.Text  =  System.DateTime.Now.ToString();
    }

以上程序的实际执行并不如预期的那样，UpdatePanel 中的时间是更新了，但是页面却会有闪烁的效果，这个 PostBack 并没有受到 UpdatePanel 的控制。

经过后来的多次的测试后发现，其实只要做一点修改就可以达到页面不闪烁的效果，就是在 __doPostBack 函数的第一个参数 (eventTarget)，传入 UpdatePanel 的 ClientID 即可。如下：

< input  id ="Button1"  type ="button"  value ="button"  onclick ="__doPostBack('UpdatePanel1','');"   />