通過使用部分頁呈現，可在支持 AJAX 的 ASP.NET 應用程序中創建更豐富的用戶體驗。 部分頁呈現 可讓您無需因回發而刷新整個頁面， 而是可以指定僅要刷新的頁面區域。 結果，用戶在每次回發時將不 會再看到整個頁面重新加載。
可使用 UpdatePanel 和 ScriptManager Web 服務器控件來啟用部分頁呈現。UpdatePanel 控件標識 可更新的頁面區域。ScriptManager 控件跟蹤頁面上的 UpdatePanel 控件和觸發要更新的 UpdatePanel 控件的控件。UpdatePanel 控件內導致回發的控件會自動標識為更新面板的觸發器。還可以指定 UpdatePanel 控件外的控件。外部觸發器可以是另一個 UpdatePanel 控件的子控件。
在一個頁面上使用多個 UpdatePanel 控件
對於在一個頁面上可以放置的 UpdatePanel 控件的數目沒有限制。因此，可以指定獨立於整個頁面單 獨刷新且相互獨立的多個頁面區域。
默認情況下，UpdatePanel 控件的 UpdateMode 屬性設置為 Always。這意味著每當觸發部分頁刷新時 ，UpdatePanel 控件就會刷新頁面，即使觸發器不是針對該 UpdatePanel 控件的也是如此。若要確保 UpdatePanel 控件僅在已被觸發時才刷新，可將 UpdatePanel 控件的 UpdateMode 屬性設置為 Conditional。
下面的示例包括兩個 UpdatePanel 控件。一個控件包含接受用戶輸入的 Web 控件，另一個控件顯示 用戶輸入的內容。每個 UpdatePanel 控件的 UpdateMode 屬性都設置為 Conditional 。因此，如果用 戶單擊“取消”按鈕來清除輸入窗體的字段，則僅刷新 UpdatePanel 控件的輸入窗體。如果用戶單擊“ 插入”按鈕以提交窗體，則兩個 UpdatePanel 控件都會刷新。
<%@ Page Language="VB" %>
<%@ Import Namespace="System.Collections.Generic" %>
<!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 id="Head1" runat="server">
<title>Enter New Employees</title>
<script runat="server">
Private EmployeeList As List(Of Employee)
Protected Sub Page_Load()
If Not IsPostBack Then
EmployeeList = New List(Of Employee)
EmployeeList.Add(New Employee(1, "Jump", "Dan"))
EmployeeList.Add(New Employee(2, "Kirwan", "Yvette"))
ViewState("EmployeeList") = EmployeeList
Else
EmployeeList = CType(ViewState("EmployeeList"), List(Of Employee))
End If
EmployeesGridView.DataSource = EmployeeList
EmployeesGridView.DataBind()
End Sub
Protected Sub InsertButton_Click(ByVal sender As Object, ByVal e As EventArgs)
If String.IsNullOrEmpty(FirstNameTextBox.Text) Or _
String.IsNullOrEmpty(LastNameTextBox.Text) Then Return
Dim employeeID As Integer = EmployeeList(EmployeeList.Count - 1).EmployeeID + 1
Dim lastName As String = Server.HtmlEncode(FirstNameTextBox.Text)
Dim firstName As String = Server.HtmlEncode(LastNameTextBox.Text)
FirstNameTextBox.Text = String.Empty
LastNameTextBox.Text = String.Empty
EmployeeList.Add(New Employee(employeeID, lastName, firstName))
ViewState("EmployeeList") = EmployeeList
EmployeesGridView.DataBind()
EmployeesGridView.PageIndex = EmployeesGridView.PageCount
End Sub
Protected Sub CancelButton_Click(ByVal sender As Object, ByVal e As EventArgs)
FirstNameTextBox.Text = String.Empty
LastNameTextBox.Text = String.Empty
End Sub
<Serializable()> _
Public Class Employee
Private _employeeID As Integer
Private _lastName As String
Private _firstName As String
Public ReadOnly Property EmployeeID() As Integer
Get
Return _employeeID
End Get
End Property
Public ReadOnly Property LastName() As String
Get
Return _lastName
End Get
End Property
Public ReadOnly Property FirstName() As String
Get
Return _firstName
End Get
End Property
Public Sub New(ByVal employeeID As Integer, ByVal lastName As String, ByVal firstName As String)
_employeeID = employeeID
_lastName = lastName
_firstName = firstName
End Sub
End Class
</script>
</head>
<body>
<form id="form1" runat="server">
<div>
</div>
<asp:ScriptManager ID="ScriptManager1" runat="server" EnablePartialRendering="true" />
<table>
<tr>
<td style="height: 206px" valign="top">
<asp:UpdatePanel ID="InsertEmployeeUpdatePanel" runat="server" UpdateMode="Conditional">
<ContentTemplate>
<table cellpadding="2" border="0" style="background-color:#7C6F57">
<tr>
<td><asp:Label ID="FirstNameLabel" runat="server" AssociatedControlID="FirstNameTextBox"
Text="First Name" ForeColor="White" /></td>
<td><asp:TextBox runat="server" ID="FirstNameTextBox" /></td>
</tr>
<tr>
<td><asp:Label ID="LastNameLabel" runat="server" AssociatedControlID="LastNameTextBox"
Text="Last Name" ForeColor="White" /></td>
<td><asp:TextBox runat="server" ID="LastNameTextBox" /></td>
</tr>
<tr>
<td></td>
<td>
<asp:LinkButton ID="InsertButton" runat="server" Text="Insert" OnClick="InsertButton_Click" ForeColor="White" />
<asp:LinkButton ID="Cancelbutton" runat="server" Text="Cancel" OnClick="CancelButton_Click" ForeColor="White" />
</td>
</tr>
</table>
<asp:Label runat="server" ID="InputTimeLabel"><%=DateTime.Now % ></asp:Label>
</ContentTemplate>
</asp:UpdatePanel>
</td>
<td style="height: 206px" valign="top">
<asp:UpdatePanel ID="EmployeesUpdatePanel" runat="server" UpdateMode="Conditional">
<ContentTemplate>
<asp:GridView ID="EmployeesGridView" runat="server" BackColor="LightGoldenrodYellow" BorderColor="Tan"
BorderWidth="1px" CellPadding="2" ForeColor="Black" GridLines="None" AutoGenerateColumns="False">
<FooterStyle BackColor="Tan" />
<SelectedRowStyle BackColor="DarkSlateBlue" ForeColor="GhostWhite" />
<PagerStyle BackColor="PaleGoldenrod" ForeColor="DarkSlateBlue" HorizontalAlign="Center" />
<HeaderStyle BackColor="Tan" Font-Bold="True" />
<AlternatingRowStyle BackColor="PaleGoldenrod" />
<Columns>
<asp:BoundField DataField="EmployeeID" HeaderText="Employee ID" />
<asp:BoundField DataField="LastName" HeaderText="Last Name" />
<asp:BoundField DataField="FirstName" HeaderText="First Name" />
</Columns>
<PagerSettings PageButtonCount="5" />
</asp:GridView>
<asp:Label runat="server" ID="ListTimeLabel"><%=DateTime.Now % ></asp:Label>
</ContentTemplate>
<Triggers>
<asp:AsyncPostBackTrigger ControlID="InsertButton" EventName="Click" />
</Triggers>
</asp:UpdatePanel>
</td>
</tr>
</table>
</form>
</body>
</html>
