Search
Author
ASP.NET Tutorials
Author
Sheo Narayan
Advertisements


Winners

Win Prizes

Social Presence
Like us on Facebook

Silverlight Tutorials | Report a Bug in the Tutorial
asp:DetailsView control
DetailsView control is a data-bound control that renders a single record at a time.
 
DetailsView control is a data-bound control that renders a single record at a time. It can provide navigation option also. It can insert, update and delete the record also. When it is rendered on the page, generally it is implemented through <table> HTML tag.

Its properties like BackColor, ForeColor, BorderColor, BorderStyle, BorderWidth, Height etc. are implemented through style properites of <tahle> tag.

Following are some important properties that are very useful.
Behavior Properties of the DetailsView Control
AllowPaging true/false. Indicate whether the control should support navigation.
DataSource Gets or sets the data source object that contains the data to populate the control.
DataSourceID Indicate the bound data source control to use (Generally used when we are using SqlDataSource or AccessDataSource to bind the data, See 1st Grid example).
AutoGenerateEditButton true/false. Indicates whether a separate column with edit link/button should be added to edit the record.
AutoGenerateDeleteButton true/false. Indicates whether a separate column with delete link/button should be added to delete the record.
AutoGenerateRows true/false. Indicate whether rows are automatically created for each field of the data source. The default is true.
DefaultMode read-only/insert/edit. Indicate the default display mode.
Style Properties of the DetailsView Control
AlternatingRowStyle Defines the style properties for every alternate row in the DetailsView.
EditRowStyle Defines the style properties for the row in EditView (When you click Edit button for a row, the row will appear in this style).
RowStyle Defines the style properties of the rows of the DetailsView.
PagerStyle Defines the style properties of Pager of the DetailsView. (If AllowPaging=true, the page number row appears in this style)
EmptyDataRowStyle Defines the style properties of the empty row, which appears if there is no records in the data source.
HeaderStyle Defines the style properties of the header of the DetailsView. (The column header appears in this style.)
FooterStyle Defines the style properties of the footer of DetailsView.
Appearance Properties of the DetailsView Control
CellPadding Indicates the amount of space in pixel between the cells and the border of the DetailsView.
CellSpacing Indicates the amount of space in pixel between cells.
GridLines Both/Horizontal/Vertical/None. Indicates whether GrdiLines should appear or not, if yes Horizontal, Vertical or Both.
HorizontalAlign Indicates the horizontal alignment of the DetailsView.
EmptyDataText Indicates the text to appear when there is no record in the data source.
BackImageUrl Indicates the location of the image that should display as a background of the DetailsView.
Caption Gets or sets the caption of the DetailsView.
CaptionAlign left/center/right. Gets or sets the horizontal position of the DetailsView caption.
State Properties of DetailsView Control
Rows Gets the collection of objects that represent the rows in the DetailsView.
FooterRow Returns a DetailsViewRow object that represents the footer of the DetailsView.
HeaderRow Returns a DetailsViewRow object that represents the header of the DetailsView.
PageCount Gets the number of the pages required to display the records of the data source.
PageIndex Gets or sets the 0-based page index.
DataKeyNames Gets an array that contains the names of the primary key field of the currently displayed rows in the DetailsViewRow.
DataKeys Gets a collection of DataKey objects that represent the value of the primary key fields set in DataKeyNames property of the DetailsViewRow.
Events of the DetailsView Control
ItemCommand Fires when any clickable element on the control is clicked.
ItemCreated Fires after DetailsView fully creates all rows of the record.
ItemDeleting, ItemDeleted Both event fires when current record is deleted. The first one fires before and other fires after record is deleted.
ItemInserting, ItemInserted Both event fires when an item is inserted. The first one fires before and second after the item is created.
ItemUpdating, ItemUpdated Both event fires when an item is updated. The first one fires before and second fires after the record is updated.
ModeChanging, ModeChanged Both event fires when DetailsView change its display mode. The first one fires before and second fires after display mode is changed.
PageIndexChanging, PageIndexChanged Both event fires when the DetailsView move to another record. The first one fires before and second fires after page is changed.
DEMO : DetailsView Show Source Code
AutoID 19379
Name 
Address 
Phone 
City 
Edit Delete New
12345678910...
 
      
// DetailsView control          
<asp:DetailsView ID="DetailsView1" runat="Server" CellPadding="4" ForeColor="#333333" GridLines="None"
     Width="100%" DataSourceID="SqlDataSource1" AllowPaging="True" AutoGenerateRows="False" DataKeyNames="AutoID"
     AutoGenerateDeleteButton="True" AutoGenerateEditButton="True" AutoGenerateInsertButton="True" >
        <FooterStyle BackColor="#5D7B9D" Font-Bold="True" ForeColor="White" />
        <CommandRowStyle BackColor="#E2DED6" Font-Bold="True" />
        <EditRowStyle BackColor="#999999" />
        <RowStyle BackColor="#F7F6F3" ForeColor="#333333" />
        <PagerStyle BackColor="#284775" ForeColor="White" HorizontalAlign="Center" />
        <FieldHeaderStyle BackColor="#E9ECF1" Font-Bold="True" />
        <HeaderStyle BackColor="#5D7B9D" Font-Bold="True" ForeColor="White" />
        <AlternatingRowStyle BackColor="White" ForeColor="#284775" />
        <Fields>
            <asp:TemplateField HeaderText="AutoID">
                <ItemTemplate>
                    <%# Eval("AutoID") %>
                </ItemTemplate>
            </asp:TemplateField>
            <asp:BoundField DataField="Name" HeaderText="Name" />
            <asp:BoundField DataField="Address" HeaderText="Address" />
            <asp:BoundField DataField="Phone" HeaderText="Phone" />
            <asp:BoundField DataField="City" HeaderText="City" />
        </Fields>
    </asp:DetailsView>

// SqlDataSource control
    <asp:SqlDataSource ID="SqlDataSource1" runat="server" ConnectionString='<%$ ConnectionStrings:ConnStr %>'
     SelectCommand="Select * FROM SampleForTutorials ORDER BY [Name]"
     DeleteCommand="Delete FROM SampleForTutorials WHERE AutoID = @AutoID"
     UpdateCommand="UPDATE SampleForTutorials SET Name = @Name, Address = @Address, Phone = @Phone, City = @City WHERE AutoID = @AutoID"
     InsertCommand="INSERT INTO SampleForTutorials (Name, Address, Phone, City) VALUES (@Name, @Address, @Phone, @City)">
        <DeleteParameters>
            <asp:Parameter Name="AutoID" />
        </DeleteParameters>
        <UpdateParameters>
            <asp:Parameter Name="AutoID" Type="Int32" />
            <asp:Parameter Name="Name" Type="string" Size="50" />
            <asp:Parameter Name="Address" Type="string" Size="200" />
            <asp:Parameter Name="Phone"  Type="string" Size="50" />
            <asp:Parameter Name="City" Type="string" Size="20" />
        </UpdateParameters>
        <InsertParameters>
            <asp:Parameter Name="Name" Type="string" Size="50" />
            <asp:Parameter Name="Address" Type="string" Size="200" />
            <asp:Parameter Name="Phone" Type="string" Size="50" />
            <asp:Parameter Name="City" Type="string" Size="20" />
            <asp:Parameter Name="AutoID" Type="Int32" />
        </InsertParameters>
     </asp:SqlDataSource>