更新面板示例

Created: November-22, 2018

第 1 步：将 ScriptManager 添加到你的页面

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

第 2 步：在 ScriptManager 之后立即将 UpdatePanel 添加到你的页面。

<asp:UpdatePanel ID="UpdatePanel1" runat="server">
            <ContentTemplate></ContentTemplate>
        </asp:UpdatePanel>

第 3 步：将内容添加到 UpdatePanels 内容模板后，你的 aspx 页面应如下所示：

<%@ Page Language="C#" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">    

<html xmlns="http://www.w3.org/1999/xhtml" >
<head runat="server">
    <title>Untitled Page</title>
    <style type="text/css">
    #UpdatePanel1 { 
      width:300px; height:100px;
     }
    </style>
</head>
<body>
    <form id="form1" runat="server">
    <div style="padding-top: 10px">
        <asp:ScriptManager ID="ScriptManager1" runat="server">
        </asp:ScriptManager>
        <asp:UpdatePanel ID="UpdatePanel1" runat="server">
            <ContentTemplate>
                <fieldset>
                <legend>UpdatePanel</legend>
                <asp:Label ID="Label1" runat="server" Text="Panel created."></asp:Label><br />
                <asp:Button ID="Button1" runat="server" OnClick="Button1_Click" Text="Button" />
                </fieldset>
            </ContentTemplate>
        </asp:UpdatePanel>
        <br />
        </div>

    </div>
    </form>
</body>
</html>

第 4 步：将此部分添加到你的 C#页面：

protected void Button1_Click(object sender, EventArgs e)
{
    Label1.Text = "Refreshed at " +
        DateTime.Now.ToString();
}

第 5 步：现在运行你的应用程序。

预期结果：

每次单击按钮时面板内容都会更改，但整个页面不会刷新。默认情况下，UpdatePanel 控件的 ChildrenAsTriggers 属性为 true。当此属性设置为 true 时，如果面板中的任何控件导致回发，则面板内的控件将参与部分页面更新。