The <asp:DetailsView> control is used to display single records from a data source where each data row represents a field in the record. The DetailsView includes features for on-line editing of database records as well as for their display. The present focus is on using the control for presentation of information. Its basic layout and formatting options are shown in Figure 7-22.

<asp:DetailsView id="id" Runat="Server"
  AllowPaging="False|True"
  AutoGenerateRows="False|True"
  Caption="string"
  CaptionAlign="Top|Bottom|Left|Right|NotSet"
  CellPadding="n"
  CellSpacing="n"
  DataSourceID="id"
  EmptyDataText="string"
  FooterText="string"
  GridLines="Both|Horizontal|Vertical|None"
  HeaderText="string"
  
  HeaderStyle-property="value"...
  RowStyle-property="value"...
  AlternatingRowStyle-property="value"...
  FooterStyle-property="value"...
  property="value"...	
	 
  PagerSettings-property="value"...
  PagerStyle-property="value"...

/>

The DetailsView's DataSourceID property associates the control with a data source control for binding to an external data source. It automatically generates as many rows as there are data fields retrieved from the data source. Server style properties can be applied to all or specified rows.

Creating a DetailsView Display

It requires minimal code to produce a default DetailsView. The following display presents all data fields from records in the Books table of the BooksDB.mdb database. Pager settings are included to permit scrolling through all records. Sorting is not permitted for a DetailsView.

<asp:AccessDataSource id="BookSource" Runat="Server"
  DataFile="../Databases/BooksDB.mdb"
  SelectCommand="SELECT * FROM Books" ORDER BY BookID/>
	
<asp:DetailsView id="BookView" DataSourceID="BookSource" Runat="Server"
  AllowPaging="True"
  RowStyle-VerticalAlign="Top"/>

The DetailsView produces a row of data for each of the database fields in the returned recordset; a single record at a time is displayed. Row headings are automatically generated from the field names in the database.

By default, the number of paging buttons (number links) displayed is ten at a time. This number can be changed with the PageButtonCount="n" property.

Selecting and Formatting Rows

Like the GridView, the DetailsView permits selection and formatting of data fields. It supplies a <Fields> section that functions like the GridView's <Columns> section, using <asp:BoundField>, <asp:ImageField>, <asp:CheckBoxField>, and <asp:TemplateField> controls to individually bind data items. The general format of the <Fields> section is shown below. Properties and values available for bound fields are the same as for a GridView, except that footers are not recognized for individual fields.

<asp:DetailsView id="id" Runat="Server"
  AutoGenerateRows="False"
  ...>
  
  <Fields>
	
    <asp:BoundField.../>
		
    <asp:ImageField.../>
		
    <asp:CheckBoxField.../>
		
    <asp:TemplateField.../>
		
    ...
	
  </Fields>
	
</asp:DetailsView>

In order to use bound fields rather than automatically generated fields, the DetailsView must specify AutoGenerateRows="False". Irrespective of the number of data fields returned by the data source control, only those fields identified in a bound field or template field are displayed. Below is shown a DetailsView with a selection of bound fields from the BooksDB.mdb database.

Book Details
ID	DB111
Title	Oracle Database
Type	Database
Author	K. Loney
Description	Get thorough coverage of Oracle Database 10g from the most comprehensive reference available, published by Oracle Press. With in-depth details on all the new features, this powerhouse resource provides an overview of database architecture and Oracle Grid Computing technology, and covers SQL, SQL*Plus, PL/SQL, dynamic PL/SQL, object-oriented features, and Java programming in the Oracle environment. You'll also find valuable database administration and application development techniques, plus an alphabetical reference covering major Oracle commands, keywords, features, and functions, with cross-referencing of topics.
Price	$69.99
Quantity	10
On Sale
1 2 3 4 5 6 7 8 9 10 ...

<asp:AccessDataSource id="BookSource" Runat="Server"
  DataFile="../Databases/BooksDB.mdb"
  SelectCommand="SELECT * FROM Books ORDER BY BookID"/>

<asp:DetailsView id="BookView" DataSourceID="BookSource" Runat="Server"
  AutoGenerateRows="False"
  AllowPaging="True"
  BorderStyle="Ridge"
  BorderWidth="3"
  CellPadding="2"
  GridLines="None"
  Width="500"
    HeaderText="Book Details"
    HeaderStyle-Font-Bold="True"
    HeaderStyle-HorizontalAlign="Center"
    HeaderStyle-BackColor="#E0E0E0"
    RowStyle-VerticalAlign="Top">

  <Fields>

  <asp:BoundField
    DataField="BookID"
    HeaderText="ID"
    HeaderStyle-BackColor="#E0E0E0"
    HeaderStyle-Font-Bold="True"/>

  <asp:BoundField
    DataField="BookTitle"
    HeaderText="Title"
    HeaderStyle-BackColor="#E0E0E0"
    HeaderStyle-Font-Bold="True"/>

  <asp:BoundField
    DataField="BookType"
    HeaderText="Type"
    HeaderStyle-BackColor="#E0E0E0"
    HeaderStyle-Font-Bold="True"/>	

  <asp:BoundField
    DataField="BookAuthor"
    HeaderText="Author"
    HeaderStyle-BackColor="#E0E0E0"
    HeaderStyle-Font-Bold="True"/>	

  <asp:TemplateField
    HeaderText="Description"
    HeaderStyle-BackColor="#E0E0E0"
    HeaderStyle-Font-Bold="True">
    <ItemTemplate>
      <asp:Image Style="float:left" Runat="Server"
        ImageUrl='<%# "../BookPictures/" & Eval("BookID") & ".jpg" %>'/>
      <asp:Panel Width="300px" Height="103px" ScrollBars="Auto" 
      Runat="Server">
        <asp:Label Text='<%# Eval("BookDescription") %>' Runat="Server"/>
      </asp:Panel>
    </ItemTemplate>
  </asp:TemplateField>

  <asp:BoundField
    DataField="BookPrice"
    HeaderText="Price"
    HeaderStyle-BackColor="#E0E0E0"
    HeaderStyle-Font-Bold="True"
    HtmlEncode="False"
    DataFormatString="{0:C}"/>

  <asp:BoundField
    DataField="BookQty"
    HeaderText="Quantity"
    HeaderStyle-BackColor="#E0E0E0"
    HeaderStyle-Font-Bold="True"
    HtmlEncode="False"
    DataFormatString=""{0:D}"/>

  <asp:CheckBoxField
    DataField="BookSale"
    HeaderText="On Sale"
    HeaderStyle-BackColor="#E0E0E0"
    HeaderStyle-Font-Bold="True"/>

  </Fields>

</asp:DetailsView>

The <asp:TemplateField> contains in its ItemTemplate an Image control to display the book picture and a Label enclosed inside a scrolling Panel to display text from the BookDescription field. The Image control is styled float:left so that the text field aligns to its right. Both price and quantity BoundFields specify HtmlEncode="False" in order to properly apply their format strings to numeric data.