DataBinding a DetailsView control

Data can be bound to the DetailsView control in two methods. One is the Declarative databinding and the other is programmatic databinding method. The DetailsView control provides options for implementing both the methods of binding data.

Declarative Databinding - Databinding a DetailsView control to a datasource control Using DataSourceID property

The DataSourceID property of the DetailsView control allows us to bind the DetailsView control to a data source control. In this method, the DetailsView control takes advantage of the features of the data source control and provides functionality for updating and paging. The DetailsView control supports two-way data binding which means that the edited values in the detailsview can be bound to the datasouce and this data can be stored in the database.

Programmatic Databinding - Using DataSource property

The DataSource property of the DetailsView control allows us to bind DetailsView control to various ADO.Net objects, datasets and datareaders. In this approach, we need to write the code for implementing functionalities like updating and paging.

The below code demonstrates how to bind a DetailsView control to a datasource control Using DataSourceID property and this method is called the declarative databinding method.

<asp:DetailsView ID="DetailsView1" runat="server"  AutoGenerateRows="true"
DataKeyNames="Code" DataSourceID="MyDataSource"   AutoGenerateInsertButton="true"  
 AutoGenerateEditButton="true">
</asp:DetailsView>
<asp:SqlDataSource ID="MyDataSource"  
ConnectionString="<%$Connectionstrings:ERPConnectionString%>"
SelectCommand="SELECT * FROM Sample" 
UpdateCommand="Update SAMPLE SET Name=@Name,description=@description Where Code=@Code"
DeleteCommand="Delete SAMPLE Where Code=@Code" runat="server"/>

In the given code,

• We assign the value true to the DetailsView control's AutoGenerateRows property which results in a row generation - automatically for each field of a single record in the data source.
• We assign the value true to the DetailsView control's AutoGenerateEditButton and AutoGenerateInsertButton properties which results in generation of user interface for editing and inserting records as shown in Fig:1.
• When the AutoGenerateEditButton property is set to True, the DetailsView renders the Edit button as a column and when the user presses the edit button, the Edit user interface is displayed. The edit user interface allows the user to modify the data in the record as shown in Fig:2.
• When the AutoGenerateInsertButton property is set to True, the DetailsView renders the New button as a column and when the user presses the new button, the user interface is rendered which facilitates adding of new data as shown in Fig:3.
• We assign DataKeyNames property to the name of the primary column, in this case, 'Code'. When we are updating or deleting data in the DetailsView control using DataSource control, the DataKeyNames property is used to match the values of key fields with the row to be updated or deleted.
• The code displays the database records from a Sample table in the DetailsView control.