Using the GridView and DetailsView together
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<script runat="server">
</script>
<html xmlns="http://www.w3.org/1999/xhtml" >
<head runat="server">
<title>Untitled Page</title>
</head>
<body>
<form id="form1" runat="server">
<div>
<asp:GridView ID="GridView1"
runat="server"
DataSourceId="SqlDataSource1"
AllowPaging="True"
BorderColor="#DEBA84"
BorderStyle="None"
BorderWidth="1px"
BackColor="#DEBA84"
CellSpacing="2"
CellPadding="3"
DataKeyNames="CustomerID"
AutoGenerateSelectButton="True"
AutoGenerateColumns="False"
PageSize="5">
<FooterStyle ForeColor="#8C4510"
BackColor="#F7DFB5"></FooterStyle>
<PagerStyle ForeColor="#8C4510"
HorizontalAlign="Center"></PagerStyle>
<HeaderStyle ForeColor="White"
BackColor="#A55129"
Font-Bold="True"></HeaderStyle>
<Columns>
<asp:BoundField ReadOnly="True"
HeaderText="CustomerID"
DataField="CustomerID"
SortExpression="CustomerID">
</asp:BoundField>
<asp:BoundField HeaderText="CompanyName"
DataField="CompanyName"
SortExpression="CompanyName">
</asp:BoundField>
<asp:BoundField HeaderText="ContactName"
DataField="ContactName" SortExpression="ContactName">
</asp:BoundField>
<asp:BoundField HeaderText="ContactTitle"
DataField="ContactTitle" SortExpression="ContactTitle">
</asp:BoundField>
<asp:BoundField HeaderText="Address" DataField="Address"
SortExpression="Address"></asp:BoundField>
<asp:BoundField HeaderText="City" DataField="City"
SortExpression="City"></asp:BoundField>
<asp:BoundField HeaderText="Region" DataField="Region"
SortExpression="Region"></asp:BoundField>
<asp:BoundField HeaderText="PostalCode" DataField="PostalCode"
SortExpression="PostalCode"></asp:BoundField>
<asp:BoundField HeaderText="Country" DataField="Country"
SortExpression="Country"></asp:BoundField>
<asp:BoundField HeaderText="Phone" DataField="Phone"
SortExpression="Phone"></asp:BoundField>
<asp:BoundField HeaderText="Fax" DataField="Fax"
SortExpression="Fax"></asp:BoundField>
</Columns>
<SelectedRowStyle ForeColor="White"
BackColor="#738A9C"
Font-Bold="True"></SelectedRowStyle>
<RowStyle ForeColor="#8C4510" BackColor="#FFF7E7"></RowStyle>
</asp:GridView>
<p><b>Customer Details:</b></p>
<asp:DetailsView ID="DetailsView1"
runat="server"
DataSourceId="SqlDataSource2"
BorderColor="#DEBA84"
BorderStyle="None"
BorderWidth="1px"
BackColor="#DEBA84"
CellSpacing="2"
CellPadding="3"
AutoGenerateRows="False"
DataKeyNames="CustomerID">
<FooterStyle ForeColor="#8C4510" BackColor="#F7DFB5"></FooterStyle>
<RowStyle ForeColor="#8C4510" BackColor="#FFF7E7"></RowStyle>
<PagerStyle ForeColor="#8C4510" HorizontalAlign="Center"></PagerStyle>
<Fields>
<asp:BoundField ReadOnly="True" HeaderText="CustomerID"
DataField="CustomerID" SortExpression="CustomerID">
</asp:BoundField>
<asp:BoundField HeaderText="CompanyName" DataField="CompanyName"
SortExpression="CompanyName"></asp:BoundField>
<asp:BoundField HeaderText="ContactName" DataField="ContactName"
SortExpression="ContactName"></asp:BoundField>
<asp:BoundField HeaderText="ContactTitle" DataField="ContactTitle"
SortExpression="ContactTitle"></asp:BoundField>
<asp:BoundField HeaderText="Address" DataField="Address"
SortExpression="Address"></asp:BoundField>
<asp:BoundField HeaderText="City" DataField="City"
SortExpression="City"></asp:BoundField>
<asp:BoundField HeaderText="Region" DataField="Region"
SortExpression="Region"></asp:BoundField>
<asp:BoundField HeaderText="PostalCode" DataField="PostalCode"
SortExpression="PostalCode"></asp:BoundField>
<asp:BoundField HeaderText="Country" DataField="Country"
SortExpression="Country"></asp:BoundField>
<asp:BoundField HeaderText="Phone" DataField="Phone"
SortExpression="Phone"></asp:BoundField>
<asp:BoundField HeaderText="Fax" DataField="Fax"
SortExpression="Fax"></asp:BoundField>
</Fields>
<HeaderStyle ForeColor="White" BackColor="#A55129"
Font-Bold="True"></HeaderStyle>
<EditRowStyle ForeColor="White" BackColor="#738A9C"
Font-Bold="True"></EditRowStyle>
</asp:DetailsView>
<asp:SqlDataSource ID="SqlDataSource1" runat="server"
SelectCommand="SELECT * FROM [Customers]"
ConnectionString="<%$ ConnectionStrings:AppConnectionString1 %>" />
<asp:SqlDataSource ID="SqlDataSource2" runat="server"
SelectCommand="SELECT * FROM [Customers]"
FilterExpression="CustomerID='{0}'"
ConnectionString="<%$ ConnectionStrings:AppConnectionString1 %>">
<FilterParameters>
<asp:ControlParameter Name="CustomerID" ControlId="GridView1"
PropertyName="SelectedValue"></asp:ControlParameter>
</FilterParameters>
</asp:SqlDataSource>
</div>
</form>
</body>
</html>
File: Web.config
<configuration>
<appSettings/>
<connectionStrings>
<add name="AppConnectionString1"
connectionString="Data Source=localhost\SQLEXPRESS;Initial Catalog=Northwind;Integrated Security=True"
providerName="System.Data.SqlClient" />
</connectionStrings>
<system.web>
<compilation debug="true" strict="false" explicit="true">
<codeSubDirectories>
<add directoryName="VB"></add>
<add directoryName="CS"></add>
</codeSubDirectories>
</compilation>
<pages>
<namespaces>
<clear/>
<add namespace="System"/>
<add namespace="System.Collections"/>
<add namespace="System.Collections.Specialized"/>
<add namespace="System.Configuration"/>
<add namespace="System.Text"/>
<add namespace="System.Text.RegularExpressions"/>
<add namespace="System.Web"/>
<add namespace="System.Web.Caching"/>
<add namespace="System.Web.SessionState"/>
<add namespace="System.Web.Security"/>
<add namespace="System.Web.Profile"/>
<add namespace="System.Web.UI"/>
<add namespace="System.Web.UI.WebControls"/>
<add namespace="System.Web.UI.WebControls.WebParts"/>
<add namespace="System.Web.UI.HtmlControls"/>
</namespaces>
</pages>
<authentication mode="Windows"></authentication>
<identity impersonate="true"/>
</system.web>
</configuration>
Related examples in the same category