updatePanel控件(实例)

.html

<asp:ScriptManager ID="ScriptManager1" runat="server" />

 UodatePanel1代码如下： 
<asp:UpdatePanel ID="UpdatePanel1" runat="server" UpdateMode="Conditional">
    <ContentTemplate>
        updatePanel1<br />
        <strong>Timer<br /></strong>
        <asp:Label ID="Label1" runat="server" Text="Label1" ForeColor="Blue"></asp:Label>&nbsp;
        <br />
        <span style="font-size: 9pt">(拖放一个Timer到此，设其Interval为1000，即１秒刷新一次)</span>    
    </ContentTemplate>
    <Triggers>
        <asp:AsyncPostBackTrigger ControlID="Timer1" />
    </Triggers>
</asp:UpdatePanel>
<asp:Timer ID="Timer1" runat="server" Interval="1000"></asp:Timer>

<br />
<br />
 UodatePanel2代码如下：
<asp:UpdatePanel ID="UpdatePanel2" runat="server" UpdateMode="Conditional">
    <ContentTemplate>
        updatePanel2<br />
        <strong>updateProgress</strong><br />
        <asp:Label ID="Label2" runat="server" Text="Label2" ForeColor="Blue"></asp:Label>
        <br />
        <asp:Button ID="btnProgress" runat="server" Text="刷新updatePanel2,出现updateProgress内容" OnClick="btnProgress_Click" />
    </ContentTemplate>
    <Triggers>
        <asp:AsyncPostBackTrigger ControlID="btnProgress" />
    </Triggers>
</asp:UpdatePanel>     
<asp:UpdateProgress ID="UpdateProgress1" runat="server" AssociatedUpdatePanelID="UpdatePanel2">
    <ProgressTemplate>
        <span style="font-size: 10pt; color: #ff6633"><strong>
         updatePanel2正在更新中...... </strong>
        </span>
    </ProgressTemplate>
</asp:UpdateProgress>
  
       
<br />
<br />
 UodatePanel3代码如下：      
<asp:UpdatePanel ID="UpdatePanel3" runat="server" UpdateMode="Conditional">
    <ContentTemplate>
        updatePanel3<br />
        &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <span style="font-size: 9pt"><strong>
        局部刷新(1)</strong></span><br />
        <asp:Label ID="Label3" runat="server" Text="Label3" ForeColor="Blue"></asp:Label><br />
        <asp:Button ID="Button1" runat="server" Text="刷新updatePanel3" />
    </ContentTemplate>
    <Triggers>
      <asp:AsyncPostBackTrigger ControlID="Button2" />
    </Triggers>
</asp:UpdatePanel>

<br />
<br />
 UodatePanel4代码如下：
<asp:UpdatePanel ID="UpdatePanel4" runat="server" UpdateMode="Conditional">
    <ContentTemplate>
        updatePanel4<br />
        <span style="font-size: 9pt">
         <strong>局部刷新(2)<br /></strong></span>
        <asp:Label ID="Label4" runat="server" Text="Label4" ForeColor="Blue"></asp:Label>
        <br />
     <asp:Button ID="Button2" runat="server" Text="刷新updatePanel3和updatePanel4" />
    </ContentTemplate>
    <Triggers>
        <asp:AsyncPostBackTrigger ControlID="Button2" />
    </Triggers>
</asp:UpdatePanel>

 

.cs 

 protected void Page_Load(object sender, EventArgs e)
    {
        this.Label1.Text = DateTime.Now.ToString();
        this.Label2.Text = DateTime.Now.ToString();
        this.Label3.Text = DateTime.Now.ToString();
        this.Label4.Text = DateTime.Now.ToString();              
    }
    protected void btnProgress_Click(object sender, EventArgs e)
    {
        //如果刷新速度太快则不会看到updateProgress中的内容
        //此时可以令程序延迟一段时间再执行
        System.Threading.Thread.Sleep(5000);//5秒
        Label2.Text = DateTime.Now.ToString();
    }