主要控制項
DetailsView 和 FormView控制項在顯示後端資料來源中的單個記錄時功能強大，但是強迫使用者在一頁中顯示無數條記錄這很不現實。為此，我們可以將GridView控制項和 DetailsView或FormView控制項結合在一起，來讓使用者從GridView控制項中選擇單個列，然後利用DetailsView或 FormView控制項來瀏覽或操縱其中的內容。因此，GridView是主要控制項，而細節則是通過其他控制項顯示的。
這種方法的第一步是設法可以選擇GridView控制項中的單個行（例如，可以允許使用者選擇一行顯示在其它控制項中）。此外，GridView控制項的SelecterStyle屬性可以顯式的設定所選行的風格，從而使用者知道或可以很容易的記住當前選擇的是哪一行。
可以使用一個命令域來輔助行選擇。CommandField對象的ShowSelectButton屬性使得該對象成為行選擇的對象。 CommandField的ButtonType屬性允許你控制如何進行選擇，當選定一行時，GridView控制項的DataKeyName屬性指名分配給選定項的值，該值可能通過選擇事件傳遞給其他控制項。
當單擊GridView中某行的選擇按鈕時，隨即發生返回且更新GridView的SelectedRow屬性。除了SelectedRow屬性外，GridView控制項還提供了SelectedIndex、SelectedValue、和SelectedDataKey屬性。SelectedIndex屬性返回選定行的索引，而SelectedValue和 SelectedDatakey屬性返回基於GridView的DataKeyNames屬性的值。
細節
既然已經設定好主要的GridView控制項，下一步就可以添加一個DetailsView或FormView控制項來顯示選定行中的資料。在我們的例子中，DetailsView控制項將被添加到GridView所在的頁面中。此外，DetailsView需要一個資料來源，因此要求另外一個SQL Server資料來源。我們想顯示GridView控制項中選定行中的資料，所以需要傳遞所選行的ID。
示範GridView控制項與其它資料控制項相結合應用的最好方式就是利用執行個體代碼。下面的GridView控制項串連到SQL Servcer，顯示Northwind資料庫中資料。這裡使用了三個控制項：DropDownList、GridView和DetailsView。
使用者可以使用DropDownList控制項指定載入到GridView控制項中的資料。使用者選擇某個“城市”，響應員工的資料就被載入。因此，當在 GridView控制項中通過顯示為連結標籤的命令按鈕選擇了某個記錄後，指定員工的詳細資料將會顯示在DetailsView控制項中。同時，選定行呈黃色高亮狀態，從而使用者可以容易的識別選擇的是哪一行。
代碼中使用了三個SqlDataSource對象用於為每個控制項載入資料。GridView控制項使用了來自DropDownList控制項的SQL中的選定值，這是通過將來自DropDownList控制項的值利用SqlDataSource控制項的SelectParameters屬性傳遞給SQL的。見列表A所示。
你可以使用ControlParameter對象通過指定你想使用的資料的ID和屬性來獲得表單上其它控制項中的資料。同時，當傳遞 SelectedValue屬性時，索引值也通過ControlParameter對象從GridView傳遞到DetailView控制項。 GridView中選定行的SelectedValue使用指定給GridView控制項的DataKeyNames值被賦值。此外，為了從控制項獲得資料，你還可以使用來自QuerySring，cookies和很多其它選項的資料。
列表B中包括了擁有三個控制項和用於資料載入的對象全部原始碼，本例示範了使用資料控制項操縱資料而不用編寫任何代碼。每個控制項提供了大量的事件可用來為這些事件編寫代碼實現本文的同樣任務和更多其它任務。
更多強大介面
ASP.NET 2.0包括大量以GridView為代表的資料控制項，我們使用這些控制項可以很容易地顯示來自後端資料來源中的資料。你還可以將GridView控制項和其它的像DetailsView或FormView控制項結合起來使用來操縱更多的資料對象，以及在一個表單域或單獨一個表單中顯示要編輯或瀏覽的資料。
<asp:SqlDataSource ID="ds" runat="server" SelectCommand="SELECT EmployeeID, LastName, FirstName, Region FROM Employees WHERE (City=@City)" ConnectionString="Server=localhost;Database=Northwind;Trusted_Connection=true">
<SelectParameters>
<asp:ControlParameterControlID="DropDownList1" Name="City" PropertyName="SelectedValue" Type="String" />
</SelectParameters>
</asp:SqlDataSource>
<%@ Page Language="VB.NET" %>
<html>
<head id="Head1" runat="server">
<title>Master-Detail Page Example</title>
</head><body>
<form id="frmMasterDetail" runat="server">
<b>Select a city:</b>
<asp:DropDownList ID="DropDownList1" DataSourceID="SqlDataSource2" AutoPostBack="true"
DataTextField="City" runat="server" />
<asp:SqlDataSource ID="SqlDataSource2" runat="server" SelectCommand="SELECT DISTINCT City FROM Employees"
ConnectionString="Server=localhost;Database=Northwind;Trusted_Connection=true" />
<asp:GridView ID="GridView1" AllowSorting="True" AllowPaging="True" runat="server"
DataSourceID="SqlDataSource1" DataKeyNames="EmployeeID"
AutoGenerateColumns="False" Width="427px" PageSize="10" BackColor="#c0c0c0"
BorderColor="black" BorderStyle="Groove" BorderWidth="5" Caption="GridView Example">
<SelectedRowStyleBackColor="yellow" />
<Columns>
<asp:CommandFieldShowSelectButton="True" />
<asp:BoundFieldDataField="EmployeeID" HeaderText="ID" ReadOnly="True" SortExpression="EmployeeID" />
<asp:BoundFieldDataField="LastName" HeaderText="Last" SortExpression="LastName" />
<asp:BoundFieldDataField="FirstName" HeaderText="First" SortExpression="FirstName" />
<asp:BoundFieldDataField="Region" HeaderText="Region" SortExpression="Region" />
</Columns>
</asp:GridView>
<asp:SqlDataSource ID="SqlDataSource1" runat="server" SelectCommand="SELECT EmployeeID, LastName, FirstName, Region FROM Employees WHERE (City=@City)"
ConnectionString="Server=localhost;Database=Northwind;Trusted_Connection=true">
<SelectParameters>
<asp:ControlParameterControlID="DropDownList1" Name="City" PropertyName="SelectedValue" Type="String" />
</SelectParameters>
</asp:SqlDataSource>
<asp:DetailsViewAutoGenerateRows="False" DataKeyNames="EmployeeID"
DataSourceID="SqlDataSource3"
HeaderText="Employee Details" ID="DetailsView1" runat="server" Width="275px">
<Fields>
<asp:BoundFieldDataField="EmployeeID" HeaderText="ID" ReadOnly="True" />
<asp:BoundFieldDataField="LastName" HeaderText="Last" />
<asp:BoundFieldDataField="FirstName" HeaderText="First" />
<asp:BoundFieldDataField="Region" HeaderText="Region" />
</Fields>
</asp:DetailsView>
<asp:SqlDataSource ConnectionString="Server=localhost;Database=Northwind;Trusted_Connection=true" ID="SqlDataSource3"
runat="server" SelectCommand="SELECT EmployeeID, LastName, FirstName, Region FROM Employees WHERE (EmployeeID = @EmployeeID)">
<SelectParameters>
<asp:ControlParameterControlID="GridView1" Name="EmployeeID" PropertyName="SelectedValue" Type="String" />
</SelectParameters>
</asp:SqlDataSource>
</form></body></html>
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
