2004 年 7 月
2005 年 8 月更新
適用於:
Microsoft ASP.NET 2.0 framework
Microsoft Visual Studio 2005
ASP.NET GridView 和 DetailsView 控制項
使用 ASP.NET 2.0 架構中的兩個新控制項 GridView 與 DetailsView 顯示和編輯資料庫資料和單一資料庫資料錄。
內容
使用 GridView 控制項
使用 GridView 控制項排序和分頁資料錄
用戶端排序和分頁
使用 GridView 控制項編輯
使用 DetailsView 控制項
結論
ASP.NET 2.0 架構介紹兩個使用資料庫資料的新控制項:GridView 控制項與 DetailsView 控制項。當使用一組資料庫資料錄時,使用 GridView 控制項。當使用個別資料錄時,使用 DetailsView 控制項。
GridView 控制項是 DataGrid 控制項的後續產品。雖然 Microsoft ASP.NET 2.0 仍然包括 DataGrid 控制項,不過還是鼓勵您利用 GridView 控制項的新功能。
GridView 控制項可讓您執行許多之前使用 DataGrid 控制項執行的相同工作。GridView 控制項的優點在於,在許多情況下您可以不需撰寫任何程式碼即可執行這些工作。GridView 控制項可讓您:
- 顯示一組資料庫資料錄。
- 排序一組資料庫資料錄。
- 將一組資料庫資料錄分頁。
- 編輯一組資料庫資料錄。
此外,與 DataGrid 控制項不同的是,GridView 控制項可讓您在不需回傳至伺服器的情況下排序和分頁資料庫資料錄。GridView 控制項也可以使用用戶端指令碼,讓您不需執行表單張貼即可排序和分頁資料庫資料錄。
DetailsView 控制項是 ASP.NET 2.0 所推出的全新控制項,可讓您使用個別的資料庫資料錄。您可以單獨使用 DetailsView 控制項以顯示或編輯單一資料庫資料錄。當與 GridView 控制項一起使用時,您可以使用 DetailsView 控制項快速建立主要/詳細表單。
使用 GridView 控制項
在「程式碼範例 1」中的頁面示範了 GridView 控制項最簡單的使用方式。該頁顯示 Pubs 資料庫中 Titles 資料表的資料錄。
程式碼範例 1. 使用 GridView 控制項顯示資料庫資料錄
<html> <head runat="server"> <title>Display GridView</title> </head> <body> <form id="form1" runat="server"> <asp:GridView DataSourceID="TitlesSource" Runat="Server" /> <asp:SqlDataSource ID="TitlesSource" ConnectionString= "Server=localhost;Database=pubs;Trusted_Connection=true" SelectCommand="SELECT * FROM Titles" Runat="Server" /> </form> </body> </html>
「圖 1」顯示「程式碼範例 1」中 GridView 控制項所產生的輸出。請注意「程式碼範例 1」中的頁面並未包含任何程式碼。GridView 利用 DataSource 控制項擷取它所顯示的資料錄。GridView 控制項是透過其 DataSourceID 屬性與 DataSource 控制項相關聯。
![按一下這裡觀看放大的影像。](https://i-blog.csdnimg.cn/blog_migrate/f0a6b1181f8759276f7e7f7d88e860d1.png)
圖 1. GridView 控制項
ASP.NET 2.0 架構包括數個設計用以使用不同資料來源的 DataSource 控制項。在「程式碼範例 1」中的頁面包含 SqlDataSource 控制項。 SqlDataSource 控制項代表任何 SQL 資料庫中的資料錄,包括 Microsoft SQL Server 與 Oracle 資料庫。ASP.NET 2.0 架構也包括 AccessDataSource 控制項,可用以呈現 Microsoft Access 資料庫資料表的資料錄。
GridView 控制項依預設會自動產生它所顯示的所有資料行。它會自動為其資料來源所表示的每個資料庫資料行建立資料行。如果您需要對 GridView 的外觀有更多的控制權,您可以將其 AutoGenerateColumns 屬性的值設為 false,並明確地列出您要顯示的欄位。
GridView 支援下列的欄位類型:
- BoundField—將欄位的值顯示成文字字串。
- ButtonField—顯示使用者指定的按鈕。
- CheckboxField—當欄位值是布林值時顯示核取方塊。
- CommandField—自動產生例如 [編輯]、[更新] 或 [取消] 按鈕等命令按鈕。
- HyperLinkField—將欄位值顯示成超連結。
- ImageField—當欄位值代表一影像時,自動顯示影像。
- TemplateField—藉由提供範本以利使用者自訂資料行的外觀。
例如,「程式碼範例 2」中的 GridView 使用 BoundField 與 ImageField 顯示 Employees 資料表 (位於 Northwind 資料庫) 中每位員工的姓氏與相片。
程式碼範例 2. 使用 GridView 顯示欄位
<html> <head runat="server"> <title>Display Explicit Fields</title> </head> <body> <form runat="server"> <asp:GridView DataSourceID="ProductsSource" AutoGenerateColumns="false" Runat="Server"> <Columns> <asp:BoundField DataField="LastName" NullDisplayText="no value" /> <asp:ImageField DataField="Photo" AlternateTextField="LastName" AlternateTextFormatString="Photo of {0}" /> </Columns> </asp:GridView> <asp:SqlDataSource ID="ProductsSource" ConnectionString= "Server=localhost;Database=Northwind;Trusted_Connection=true" SelectCommand="SELECT * FROM Employees" Runat="Server" /> </form> </body> </html>
「圖 2」顯示「程式碼範例 2」所產生的輸出。請注意 BoundField 是使用 NullDisplayText 屬性的值來宣告 。您可以使用 NullDisplayText 屬性來指定當資料行包含 Null 值時要顯示的文字。
![按一下這裡觀看放大的影像。](https://i-blog.csdnimg.cn/blog_migrate/29deebc8c79c87d34d19001ed966f200.png)
圖 2. 顯示 NullDisplayText 的 GridView
請注意 ImageField 也是使用其 AlternateTextField 與 AlternateTextFormatString 屬性的值來宣告。這些屬性可針對視障的使用者改善頁面的可讀性。
使用 GridView 控制項排序和分頁資料錄
使用 GridView 控制項排序和分頁資料錄是再也簡單不過的事。當 GridView 控制項的 AllowSorting 屬性值為 true 時,您可以藉由按一下標頭資料行來排序 GridView 中的資料行。當 AllowPaging 屬性的值為 true 時,您可以在 GridView 中分頁資料錄集。
「程式碼範例 3」示範 AllowSorting 與 AllowPaging 屬性如何與 GridView 一起使用 (請參閱「圖 3」)
「程式碼範例 3」。使用 GridView 排序和分頁
<html> <head runat="server"> <title>Sorting and Paging a GridView</title> </head> <body> <form id="form1" runat="server"> <asp:GridView DataSourceID="TitlesSource" AllowSorting="true" AllowPaging="true" Runat="Server" /> <asp:SqlDataSource ID="TitlesSource" ConnectionString= "Server=localhost;Database=pubs;Trusted_Connection=true" SelectCommand="SELECT * FROM Titles" Runat="Server" /> </form> </body> </html>
![按一下這裡觀看放大的影像。](https://i-blog.csdnimg.cn/blog_migrate/0d2583765c544b55265a58748c40c095.png)
「圖3」。啟用排序和分頁的 GridView
GridView 控制項支援遞增和遞減排序。換句話說,當您對 GridView 資料行標頭按多次時,資料行排序順序會在遞增與遞減排序之間快速切換。
根據預設,當 AllowPaging 的值為 true 時,您可以按一下頁碼在資料錄頁面之間移動。您可以藉由修改 PagerSettings 與 PagerStyles 屬性,以修改分頁使用者介面。GridView 控制項支援下列的介面:
- NextPrevious—顯示下一個和上一個連結。
- NextPreviousFirstLast—顯示下一個和上一個連結以及連到第一頁和最後一頁的連結。
- Numeric—顯示頁碼連結。
- NumericFirstLast—顯示頁碼連結以及至第一頁和最後一頁的連結。
例如,下列的 GridView 宣告會呈現一個擁有第一個、上一個、下一個以及最後一個連結的 GridView。而且,這些連結會以影像呈現 (請參閱「圖 4」)。
<asp:GridView DataSourceID="TitlesSource" AllowPaging="true" PageSize="4" Runat="Server"> <PagerSettings Mode="NextPreviousFirstLast" FirstPageImageUrl="First.gif" PreviousPageImageUrl="Prev.gif" NextPageImageUrl="Next.gif" LastPageImageUrl="Last.gif" /> </asp:GridView>
![按一下這裡觀看放大的影像。](https://i-blog.csdnimg.cn/blog_migrate/57f76777aa49a2a75a4e0c13021c4a2f.png)
圖 4. 使用影像分頁
用戶端排序和分頁
GridView 控制項提供您在不需將表單傳回至 Web 伺服器的情況下排序資料錄以及將資料錄分頁的選項。換句話說,您可以在排序和分頁時重新呈現 GridView 的內容,而不需重新呈現整頁。
您可以將 true 值指派為 EnableSortingAndPagingCallback 屬性。當此屬性的值為 true 時,GridView 會使用 JavaScript 對 Web 伺服器要求更新的資料錄集。
在「程式碼範例 4」中的頁面示範如何使用 EnableSortingAndPagingCallback 屬性。
程式碼範例 4. 在排序和分頁時使用回呼
<html> <head runat="server"> <title>Callback GridView</title> </head> <body> <form runat="server"> <%=DateTime.Now %> <asp:GridView DataSourceID="TitlesSource" EnableSortingAndPagingCallbacks="true" AllowPaging="true" AllowSorting="true" Runat="Server" /> <asp:SqlDataSource ID="TitlesSource" ConnectionString= "Server=localhost;Database=pubs;Trusted_Connection=true" SelectCommand="SELECT * FROM Titles" Runat="Server" /> </form> </body> </html>
在「程式碼範例 4」中的頁面顯示目前的日期和時間,以及 Titles 資料庫資料表的內容。當您在 GridView 中排序和分頁資料錄時,該頁面所顯示的時間不會變更。該時間不會變更是因為該頁面並未重新載入。
在背景作業中,GridView 使用 Microsoft Internet Explorer XMLHTTPRequest 物件以以與 Web 伺服器通訊。Internet Explorer 5.0 及更新的版本支援此物件。
使用 GridView 控制項編輯
您可以藉由設定單一屬性讓使用者編輯 GridView 所顯示的資料:AutoGenerateEditButton 屬性。當與 GridView 相關聯的 SqlDataSource 控制項,將其 UpdateCommand 屬性設為有效的 SQL UPDATE 命令時,將會自動更新該資料庫。
例如,在「程式碼範例 5」中的頁面可讓您更新 Products 資料庫資料表中的內容 (請參閱「圖 5」)。
程式碼範例 5. 在 GridView 中編輯
<html> <head runat="server"> <title>Edit GridView</title> </head> <body> <form id="Form1" runat="server"> <asp:GridView DataSourceID="ProductsSource" AutoGenerateEditButton="true" DataKeyNames="ProductID" Runat="Server" /> <asp:SqlDataSource ID="ProductsSource" ConnectionString= "Server=localhost;Database=Northwind;Trusted_Connection=true" SelectCommand= "SELECT ProductID,ProductName,Discontinued FROM Products" UpdateCommand="Update Products SET ProductName=@ProductName,Discontinued=@Discontinued WHERE ProductID=@ProductID" Runat="Server" /> </form> </body> </html>
![按一下這裡觀看放大的影像。](https://i-blog.csdnimg.cn/blog_migrate/06df77eca59a53a8c21bc22f398ea146.png)
圖 5. 在 GridView 中編輯
在大部的情況下,GridView 可以自動判斷您正在更新的資料行之資料型別。在「程式碼範例 5」頁面中,從 ProductID 文字方塊所擷取的值將會自動轉換成整數,至於 Discontinued 核取方塊所擷取的值,則會在執行 UPDATE 命令之前自動轉換為 BIT (您可以在執行頁面時,藉由執行 SQL Profiler 工具以檢查此議題)。
不過有一些資料型別是 GridView 不會自動轉換的,例如 Decimal 資料行。如果您需要使用 Decimal 資料行,您將需要明確地在 SqlDataSource 中指定資料行的資料型別。在「程式碼範例 6」中的頁面說明如何進行此作業。
程式碼範例 6. 以 Decimal 資料行更新
<html> <head runat="server"> <title>Edit GridView with Decimal</title> </head> <body> <form id="Form1" runat="server"> <asp:GridView DataSourceID="ProductsSource" AutoGenerateEditButton="true" DataKeyNames="ProductID" Runat="Server" /> <asp:SqlDataSource ID="ProductsSource" ConnectionString= "Server=localhost;Database=Northwind;Trusted_Connection=true" SelectCommand= "SELECT ProductID,ProductName,UnitPrice,Discontinued FROM Products" UpdateCommand= "Update Products SET ProductName=@ProductName, UnitPrice=@UnitPrice, Discontinued=@Discontinued WHERE ProductID=@ProductID" Runat="Server" > <UpdateParameters> <asp:Parameter Name="UnitPrice" Type="Decimal" /> </UpdateParameters> </asp:SqlDataSource> </form> </body> </html>
請注意「程式碼範例 6」中的 SqlDataSource 控制項現在包含列出 UnitPrice 資料行資料型別的 <UpdateParameters> 標記。如果您未包含此標記,此頁面將擲回 SqlException 「不允許從資料型別 nvarchar 到 資料型別 money 的隱含轉換」。
這些使用 GridView 編輯的範例有一個問題,那就是它們都不包含任何錯誤處理程式碼。如果在執行 SQL UPDATE 命令時發生錯誤,該頁面會以很糟糕的方式爆發。
您可以為 GridView 控制項的 RowUpdated 事件藉由建立一個事件處理常式以新增錯誤處理。在「程式碼範例 7」中的頁面示範要如何從容不迫地處理 SqlExceptions。
程式碼範例 7. 使用錯誤處理編輯
[Visual Basic .NET]
<%@ Page Language="vb" %> <script runat="server"> Sub GridViewUpdated(ByVal s As Object, ByVal e As GridViewUpdatedEventArgs) If Not e.Exception Is Nothing Then lblError.Text = "Could not update row" e.ExceptionHandled = True End If End Sub </script> <html> <head runat="server"> <title>Edit GridView with Errors</title> </head> <body> <form runat="server"> <asp:Label ID="lblError" ForeColor="Red" EnableViewState="false" Runat="Server" /> <asp:GridView DataSourceID="ProductsSource" OnRowUpdated="GridViewUpdated" AutoGenerateEditButton="true" DataKeyNames="ProductID" Runat="Server" /> <asp:SqlDataSource ID="ProductsSource" ConnectionString= "Server=localhost;Database=Northwind;Trusted_Connection=true" SelectCommand= "SELECT ProductID,ProductName,Discontinued FROM Products" UpdateCommand="Update Products SET ProductName=@ProductName,Discontinued=@Discontinued WHERE ProductID=@ProductID" Runat="Server" /> </form> </body> </html>
[C#]
<%@ Page Language="c#" %> <script runat="server"> void GridViewUpdated(Object s, GridViewUpdatedEventArgs e) { if (e.Exception != null) { lblError.Text = "Could not update row"; e.ExceptionHandled = true; } } </script> <html> <head runat="server"> <title>Edit GridView with Errors</title> </head> <body> <form runat="server"> <asp:Label ID="lblError" ForeColor="Red" EnableViewState="false" Runat="Server" /> <asp:GridView DataSourceID="ProductsSource" OnRowUpdated="GridViewUpdated" AutoGenerateEditButton="true" DataKeyNames="ProductID" Runat="Server" /> <asp:SqlDataSource ID="ProductsSource" ConnectionString= "Server=localhost;Database=Northwind;Trusted_Connection=true" SelectCommand= "SELECT ProductID,ProductName,Discontinued FROM Products" UpdateCommand="Update Products SET ProductName=@ProductName,Discontinued=@Discontinued WHERE ProductID=@ProductID" Runat="Server" /> </form> </body> </html>
只要 GridView 資料列完成更新,就會立即執行 GridViewUpdated 方法。傳給 GridViewUpdatedEventArgs方法的第二個參數,具有兩個非常有用的錯誤處理屬性。您可以使用 Exception 屬性以取得當執行 SQL UPDATE 命令所擲回的任何例外狀況。ExceptionHandled 屬性可讓您指定您想要處理錯誤。如果您未將此屬性設定為 true,則會持續擲回例外狀況。
使用 DetailsView 控制項
DetailsView 控制項可讓您使用個別的資料庫資料錄。您可以使用此控制項簡化資料庫資料錄的顯示。您也可以使用此控制項來編輯、刪除和插入新資料庫資料錄。最後,當使用其他控制項時,例如 GridView 或 DropDownList 控制項時,您可以使用 DetailsView 控制項來快速建立主要/詳細表單。
使用 DetailsView 控制項顯示資料庫資料錄
使用 DetailsView 控制項可以執行的最簡單動作就是顯示單一資料庫資料錄。DetailsView 控制項會自動針對每個選取的資料欄顯示標籤和值。「程式碼範例 8」說明您可以如何使用 DetailsView 控制項從 Authors 資料庫資料表顯示單一資料錄。
程式碼範例 8. 顯示單一作者
<html> <head runat="server"> <title>Details View</title> </head> <body> <form runat="server"> <asp:DetailsView DataSourceID="AuthorsSource" Runat="Server" /> <asp:SqlDataSource ID="AuthorsSource" ConnectionString= "Server=localhost;Database=Pubs;Trusted_Connection=true" SelectCommand= "SELECT * FROM Authors WHERE au_id='172-32-1176'" Runat="Server" /> </form> </body> </html>
在「程式碼範例 8」中,DetailsView 控制項與 SqlDataSource 控制項相關聯,後者選取了 ID 為 172-32-1176 的作者。如「圖 6」中的頁面所示。
圖 6. DetailsView 控制項
注意 DetailsView 控制項自動產生的標籤與基礎資料庫的資料行名稱相對應。由於 Authors 資料庫的資料表包含 au_lname 與 au_fname等欄位名稱,這些標籤可能會看起來很怪。
如果您希望擁有更多對於 DetailsView 控制項外觀的控制權,您可以明確地列出想要控制顯示的欄位。您可以將控制項的 AutoGenerateRows 屬性設定為 false,並加入 <Fields> 標記。
DetailsView 控制項支援與 GridView 控制項相同的欄位類型。在「程式碼範例 9」中的頁面示範如何明確地指定欄位和控制欄位標籤。
程式碼範例 9. 明確列出欄位
<html> <head runat="server"> <title>Details View</title> </head> <body> <form id="Form1" runat="server"> <asp:DetailsView ID="DetailsView1" DataSourceID="AuthorsSource" AutoGenerateRows="false" Runat="Server"> <Fields> <asp:BoundField DataField="au_id" HeaderText="SS#:" ReadOnly="true" /> <asp:BoundField DataField="au_lname" HeaderText="Last Name:" /> <asp:BoundField DataField="au_fname" HeaderText="Last Name:" /> </Fields> </asp:DetailsView> <asp:SqlDataSource ID="AuthorsSource" ConnectionString= "Server=localhost;Database=Pubs;Trusted_Connection=true" SelectCommand="SELECT * FROM Authors WHERE au_id='172-32-1176'" Runat="Server" /> </form> </body> </html>
到目前為止,我們已經看過了如何使用 DetailsView 控制項顯示單一資料錄。您也可以使用 DetailsView 瀏覽多個資料錄。當您將 AllowPaging 屬性值設定為 true 時,DetailsView 控制項就會自動產生可供在資料錄之間移動的使用者介面。「程式碼範例 10」說明您如何使用此屬性。
程式碼範例 10. 使用 DetailsView 控制項瀏覽資料錄
<html> <head runat="server"> <title>Details View</title> </head> <body> <form runat="server"> <asp:DetailsView ID="DetailsView1" DataSourceID="AuthorsSource" AllowPaging="true" AutoGenerateRows="false" Runat="Server"> <Fields> <asp:BoundField DataField="au_id" HeaderText="SS#:" ReadOnly="true" /> <asp:BoundField DataField="au_lname" HeaderText="Last Name:" /> <asp:BoundField DataField="au_fname" HeaderText="Last Name:" /> </Fields> </asp:DetailsView> <asp:SqlDataSource ID="AuthorsSource" ConnectionString= "Server=localhost;Database=Pubs;Trusted_Connection=true" SelectCommand="SELECT * FROM Authors" Runat="Server" /> </form> </body> </html>
根據預設,DetailsView 控制項會顯示頁碼以利瀏覽資料錄 (請參閱「圖 7」)。您可以使用與 GridView 控制項相同的屬性來指定分頁使用者介面:PagerSettings 與 PagerStyle 屬性。
圖 7. 使用 DetailsView 控制項分頁
使用 DetailsView 控制項編輯資料庫資料錄
您可以藉由使用 DetailsView 控制項來編輯、刪除和插入資料錄。最好的是,您可以不撰寫任何程式碼即可完成這所有的作業。
AutoGenerateEditButton、AutoGenerateDeleteButton 以及 AutoGenerateInsertButton 屬性是用以針對編輯資料錄來建立使用者介面。當使用 DetailsView 控制項來編輯時,您也需要針對與 DetailsView 相關聯的 DataSource 控制項提供 UpdateCommand、InsertCommand 以及 DeleteCommand。
在「程式碼範例 11」的頁面中呈現的 DetailsView 控制項可用以編輯 Authors 資料庫資料表 (請參閱「圖 8」)。
程式碼範例 11. 使用 DetailsView 控制項編輯
<html> <head runat="server"> <title>Details View</title> </head> <body> <form runat="server"> <asp:DetailsView DataSourceID="AuthorsSource" AllowPaging="true" AutoGenerateEditButton="true" AutoGenerateDeleteButton="true" AutoGenerateInsertButton="true" DataKeyNames="au_id" Runat="Server" /> <asp:SqlDataSource ID="AuthorsSource" ConnectionString= "Server=localhost;Database=Pubs;Trusted_Connection=true" SelectCommand= "SELECT au_id,au_lname,au_fname,contract FROM Authors" UpdateCommand= "UPDATE Authors SET au_lname=@au_lname, au_fname=@au_fname, contract=@contract WHERE au_id=@au_id" DeleteCommand="DELETE Authors WHERE au_id=@au_id" InsertCommand= "INSERT Authors (au_id,au_lname,au_fname,contract) VALUES (@au_id,@au_lname,@au_fname,@contract)" Runat="Server" /> </form> </body> </html>
圖 8. 使用 DetailsView 控制項編輯
使用 DetailsView 控制項建立主要/詳細表單
在最後一節中,我們將藉由利用 DetailsView 與 GridView 控制項建立主要/詳細表單。我們將使用 GridView 控制項顯示員工的清單。當您按一下員工的姓名時,DetailsView 控制項將會顯示員工的相片、姓氏以及名字。(請參閱「圖 9」)。
![按一下這裡觀看放大的影像。](https://i-blog.csdnimg.cn/blog_migrate/762aa4791ea9d17c82d75dd4eddcc8f6.png)
圖 9. 使用 GridView 與 DetailsView 控制項建立的主要/詳細表單
在「程式碼範例 12」中的頁面包含主要/詳細表單的程式碼。
程式碼範例 12. 建立主要/詳細表單
<html> <head runat="server"> <title>Master/Detail Page</title> </head> <body> <form runat="server"> <table cellpadding="10"> <tr> <td valign="top"> <asp:GridView ID="MasterGridView" DataSourceID="MasterSource" AutoGenerateColumns="false" DataKeyNames="EmployeeID" CellPadding="5" SelectedRowStyle-BackColor="#eeeeee" Runat="Server"> <Columns> <asp:TemplateField HeaderText="Employee"> <ItemTemplate> <asp:LinkButton CommandName="Select" Runat="Server"> <%# Eval("LastName") %>, <%# Eval("FirstName") %> </asp:LinkButton> </ItemTemplate> </asp:TemplateField> </Columns> </asp:GridView> </td> <td valign="top"> <asp:DetailsView DataSourceID="DetailsSource" AutoGenerateRows="false" CellPadding="5" FieldHeaderStyle-Font-Bold="true" FieldHeaderStyle-HorizontalAlign="Right" Runat="Server"> <Fields> <asp:ImageField DataField="Photo" HeaderText="Photo:" /> <asp:BoundField DataField="LastName" HeaderText="Last Name:" /> <asp:BoundField DataField="FirstName" HeaderText="First Name:" /> <asp:BoundField DataField="Extension" HeaderText="Extension:" /> </Fields> </asp:DetailsView> </td> </tr> </table> <asp:SqlDataSource ID="MasterSource" EnableCaching="true" CacheDuration="600" ConnectionString= "Server=localhost;database=Northwind;Trusted_Connection=true" SelectCommand="SELECT * FROM Employees" Runat="Server" /> <asp:SqlDataSource ID="DetailsSource" EnableCaching="true" CacheDuration="600" ConnectionString= "Server=localhost;database=Northwind;Trusted_Connection=true" SelectCommand="SELECT * FROM Employees" FilterExpression="EmployeeID=@EmployeeID" Runat="Server"> <FilterParameters> <asp:ControlParameter Name="EmployeeID" ControlID="MasterGridView" PropertyName="SelectedValue" /> </FilterParameters> </asp:SqlDataSource> </form> </body> </html>
在「程式碼範例 12」中的 GridView 控制項包含單一 TemplateField。TemplateField 使用 LinkButton 控制項顯示員工的姓氏和名字。請注意 LinkButton 控制項的 CommandName 屬性是設為 Select 值。當您按一下 LinkButton 時,將會以 SelectedRowStyle 屬性的值來格式化選取的資料列。
DetailsView 控制項會顯示目前在 GridView 中所選取的員工資訊。與 DetailsView 控制項相關聯的 SqlDataSource 所定義的 FilterParameter 會選取正確的員工。
請注意「程式碼範例 12」中的頁面包含兩個 SqlDataSource 控制項;其中一個 SqlDataSource 是與 GridView 控制項相關聯,而另一個 SqlDataSource 則是與 DetailsView 控制項相關聯。這兩個 SqlDataSource 控制項的 SelectCommand 屬性都宣告了相同的 SELECT 命令。
此外,這兩個 SqlDataSource 控制項都是設定成快取 10 分鐘的資料。由於這兩個 SqlDataSource 控制項的 SelectCommand 屬性都有相同的值,所以實際上這兩個控制項只會從資料庫擷取一次資料。
結論
DataGrid 控制項是 ASP.NET 1.x 架構中最強而有力的控制項。在 ASP.NET 2.0 架構中,DataGrid 控制項已由兩個新的控制項所取代,這兩個控制項較易於使用且包含更多功能。
GridView 控制項可讓您不需撰寫任何程式碼,即可顯示、排序、分頁和編輯資料庫。此控制項也可讓您不需重新載入其所含的頁面,即可排序資料庫資料錄並將其分頁。
新的 DetailsView 控制項可讓您顯示和編輯單一資料庫資料錄。就如同我們所看到的,當與 GridView 控制項一起使用時,DetailsView 控制項可讓您快速地建立精選的主要/詳細表單。