ASP.Net 2.0 DataList DataBinding using DataSource

Updated on 08 Aug 2012,
Published on 03 Apr 2009

In ASP.Net 2.0, DataList DataBound control’s DataBinding feature enables you to display the data items retrieved from any DataSource. You can set the styles and layout for the data items in the ItemStyle and ItemTemplate of DataList control to display the list items in readable and user friendly format. In the previous tutorials you can learn about DataList layout Templates and DataList Style Templates. Before start learning DataBinding feature of DataList control you must also be familiar with RepeatColumns, RepeatDirection and RepeatLayout Properties of DataList control. In this tutorial we will learn the use of SqlDataSource to bind the DataList control with data items retrieved from the Products table of Northwind SQL Database. The pre-built SqlDataSource control provides the functionality to bind the SQL data with any DataBound control without any single line of C# or VB.Net code. You just need to follow the automated wizard steps to configure the SqlDataSource and then set DataSourceID property value of DataList control equal to the ID of SqlDataSource e.g: DataSourceID="SqlDataSource1".

Configuring SqlDataSource Control

For binding the SqlDataSource with DataList control you just need to drag and drop the DataList control and SqlDataSource control on ASP.Net web page. Then start with configuring the SqlDataSource using its configuration wizard. If you already have a connection string defined inside the connectionStrings section of web.config file then you can configure the SqlDataSource manually. Consider the following connectionString for this tutorial:

  <connectionStrings>
    <add name="NorthwindConnectionString" 
         connectionString="Data Source=.\SQLEXPRESS; Initial Catalog=Northwind; User ID=sa"
         providerName="System.Data.SqlClient" />
  </connectionStrings>

Above connection string will provide the connection for Northwind SQL Database. You must use the Password=YourSecretPassword after the User ID property of connection string for security purpose. To configure the SqlDataSource manually you can use the following code snippet:

<asp:SqlDataSource 
     ID="SqlDataSource1" 
     runat="server" 
     ConnectionString="<%$ ConnectionStrings:NorthwindConnectionString %>" 
     DataSourceMode="DataReader" 
     SelectCommand="SELECT [ProductName], [UnitPrice] FROM [Alphabetical list of products]">
</asp:SqlDataSource>

In the above code template expression syntax has been used to access the connection string placed inside the web.config file. <%$...%> is a declarative syntax for substituting the syntax with specified values. For example her ConnectionString and colon ":" symbol has been used in the above snippet followed by the name of the connection string. It allows you to access the connection string specified in web.config file. DataSourceMode has been set as DataReader for good performance while retrieving the records from the database. SelectCommand property of SqlDataSource accepts the string value as SQL select query to fetch the records as per the specified criteria.

DataList Control DataBinding using SqlDataSource

After configuring the SqlDataSource you need to pass its ID to the DataSourceID property of DataList control as follows:

<asp:DataList 
     ID="DataList1" 
     runat="server" 
     DataSourceID="SqlDataSource1" 
     RepeatColumns="5" 
     RepeatDirection="Horizontal" 
     RepeatLayout="Table">
    <HeaderTemplate>
        Product Catalog
    </HeaderTemplate>
    <ItemTemplate>
         <%#Eval("ProductName") %>
         <%#Eval("UnitPrice")%>
    </ItemTemplate>
    <HeaderStyle Font-Bold="true" Font-Names="Arial" />
    <ItemStyle Font-Names="Arial" Font-Size="Small" />
</asp:DataList>

You can specify the column names of Database table inside the ItemTemplate of DataList control to display the associated data items. In the above code, Eval function has been used to display the data items. It accepts the string expression as the column name of retrieved records by using the SQL select query with help of SqlDataSource.

This is the fastest and easiest way in ASP.Net 2.0 to bind the data and display it in DataList control without using C# or VB code. In the next tutorial we will learn how to perform the same task of ASP.Net DataList DataBinding using C# code.

Note: While specifying the field in the ItemTemplate of DataList control, you cannot specify the column names not being specified in the SQL select query of SqlDataSource control’s SelectCommand property.

0 Responses to "ASP.Net 2.0 DataList DataBinding using DataSource"
Leave a Comment
* required
* required
* will not be published
* optional
* hint: http://www.example.com
  • Subscribe via Email