UpdateProgress使用小结

 今天迈开学习AJAX的第一步，先大概的使用了一下自带的五个控件。在使用UpdateProgress控件的时候遇到一个小问题。现在还不知道为什么，以后知道再补到下面来。
首先我在updatePanel里面放了一个Button和Label，然后点击Button给Label赋值。这个是个很简单的过程了。
代码我就补贴了。
然后我再加了一个UpdateProgress控件，把它的AssociatedUpdatePanelID指向刚加的UpdatePanel,其代码如下：

  < asp:UpdatePanel ID = " UpdatePanel1 "  runat = " server " >
             < ContentTemplate >
             < asp:Label ID = " Label1 "  runat = " server "  Text = " Label "  Width = " 204px " ></ asp:Label >< br  />
             < asp:Button ID = " Button1 "  runat = " server "  OnClick = " Button1_Click "  Text = " Button "   />
             < asp:UpdateProgress ID = " UpdateProgress1 "  runat = " server "  AssociatedUpdatePanelID = " UpdatePanel1 "  DisplayAfter = " 1 " >
             < ProgressTemplate  >
              < p >
                 更新中......
              </ p >
             </ ProgressTemplate >
             </ asp:UpdateProgress >
             </ ContentTemplate >
         </ asp:UpdatePanel >
Button事件：
protected void Button1_Click(object sender, EventArgs e)
    {
        System.Threading.Thread.Sleep(3000);
        Label1.Text = DateTime.Now.ToString();
    }

运行结果正常，点击Button，“更新中...”出现，然后Label被赋值。

然后我把updateProgress拿到updatePanel控件外面来，运行，正常。
然后我再把button控件拿到updatePannel控件外面来，然后又在updatepanel里面加上triggers，代码如下：

  < asp:UpdatePanel ID = " UpdatePanel1 "  runat = " server " >
             < ContentTemplate >
             < asp:Label ID = " Label1 "  runat = " server "  Text = " Label "  Width = " 204px " ></ asp:Label >< br  />
                 & nbsp; & nbsp; & nbsp;  & nbsp;
             </ ContentTemplate >
             < Triggers >
                 < asp:AsyncPostBackTrigger ControlID = " Button1 "  EventName = " Click "   />
             </ Triggers >
         </ asp:UpdatePanel >
             < asp:Button ID = " Button1 "  runat = " server "  OnClick = " Button1_Click "  Text = " Button "  Width = " 201px "   />
             < asp:UpdateProgress ID = " UpdateProgress1 "  runat = " server "  AssociatedUpdatePanelID = " UpdatePanel1 "  DisplayAfter = " 1 " >
             < ProgressTemplate  >
              < p >
                 更新中......
              </ p >
             </ ProgressTemplate >
             </ asp:UpdateProgress >

运行，点击Button按钮，发现"更新中..."字段没有出现，但是赋值正常。
难道使用triggers的调用外部控件来进行异步传输，不会引发UpdateProgress?

后来在网上找到了解决方法：
在代码里面加入如下js:

< script language = " javascript "  type = " text/javascript " >
     var  prm  =  Sys.WebForms.PageRequestManager.getInstance();
    prm.add_initializeRequest(InitializeRequest);
    prm.add_endRequest(EndRequest);
     var  postBackElement;
     function  InitializeRequest(sender, args) 
     ... {
        if (prm.get_isInAsyncPostBack()) 
        ...{
            args.set_cancel(true);
        }
        
        postBackElement = args.get_postBackElement();

        if (postBackElement.id = 'Button1') ...{

            $get('UpdateProgress1').style.display = 'block';                

        }
    }
     function  EndRequest(sender, args) 
     ... {
        if (postBackElement.id = 'Button1') 
        ...{
             $get('UpdateProgress1').style.display = 'none';
        }

}
     </ script >

 

然后运行正常，从上面的js可以看出，如果是triggers触发的button事件，那么progress控件的style.display始终都是none，在button_click事件触发时，并没有使progress的 style.display变成block。所以里面的"更新中..."显示不出来。