In this article I will explain how to populate the ASP.Net ListView control from database and how to use repeat the ListView Items horizontally using its GroupItemCount property
Database and Connection string
For this sample to work you will need to download the Microsoft Northwind database using the following link
Below is the connection string from the Web.Config file
<connectionStrings>
<add name="conStr" connectionString="Data Source=.\SQLExpress;
database=Northwind;Integrated Security=true"/>
connectionStrings>
 
ListView Markup
Below is the ASP.Net ListView markup where I have bound the columns from the Customer table.
<asp:ListView ID="ListView1" runat="server" GroupItemCount="3" GroupPlaceholderID="groupPlaceHolder1"
    ItemPlaceholderID="itemPlaceHolder1">
    <LayoutTemplate>
        <table>
            <asp:PlaceHolder runat="server" ID="groupPlaceHolder1">asp:PlaceHolder>
        table>
    LayoutTemplate>
    <GroupTemplate>
        <tr>
            <asp:PlaceHolder runat="server" ID="itemPlaceHolder1">asp:PlaceHolder>
        tr>
    GroupTemplate>
    <ItemTemplate>
        <td>
            <table cellpadding="2" cellspacing="0" border="1" style="width: 200px; height: 100px;
                border: dashed 2px #04AFEF; background-color: #B0E2F5">
                <tr>
                    <td>
                        <b><u><span class="name">
                            <%# Eval("ContactName") %>span>u>b>
                    td>
                tr>
                <tr>
                    <td>
                        <b>City: b><span class="city"><%# Eval("City") %>span><br />
                        <b>Postal Code: b><span class="postal"><%# Eval("PostalCode") %>span><br />
                        <b>Country: b><span class="country"><%# Eval("Country")%>span><br />
                        <b>Phone: b><span class="phone"><%# Eval("Phone")%>span><br />
                        <b>Fax: b><span class="fax"><%# Eval("Fax")%>span><br />
                    td>
                tr>
            table>
        td>
    ItemTemplate>
asp:ListView>
 
 
 
Repeat Columns Horizontally in ASP.Net ListView control
Now this concept in ListView requires some understanding is not quite straight forward. There are three main Templates which play role. Here I am making use of HTML <table> in order to repeat columns horizontally
1. <ItemTemplate> – This contains the actual DataBound items which will be populated form Database, similar to the ItemTemplate of ASP.Net GridView or DataList controls. This section of ListView will have all the contents enclosed in HTML <table><td> tags.
2. <GroupTemplate> – This plays the vital role in repeating the ListView items horizontally. And it is associated with the GroupItemCount property. This section of ListView will have a PlaceHolder enclosed in HTML <table><tr> tags.  GroupTemplate can be imagined as one row of ListView Items and the number of Items in one row is determined by the GroupItemCount property.
2. < LayoutTemplate> – This tag determines the layout of the whole ListView.. This section of ListView will have a PlaceHolder enclosed in HTML <table> tags.
 
Namespaces
C#
using System.Data;
using System.Data.SqlClient;
using System.Configuration;
 
VB.Net
Imports System.Data
Imports System.Data.SqlClient
Imports System.Configuration
 
Binding the ASP.Net ListView control with data
Below is the code to bind the ASP.Net ListView control with data.
C#
protected void Page_Load(object sender, EventArgs e)
{
    if (!IsPostBack)
    {
        ListView1.DataSource = this.GetData();
        ListView1.DataBind();
    }
}
 
private DataSet GetData()
{
    string conString = ConfigurationManager.ConnectionStrings["constr"].ConnectionString;
    string query = "SELECT top 10 * FROM Customers";
    SqlCommand cmd = new SqlCommand(query);
    using (SqlConnection con = new SqlConnection(conString))
    {
        using (SqlDataAdapter sda = new SqlDataAdapter())
        {
            cmd.Connection = con;
            sda.SelectCommand = cmd;
            using (DataSet ds = new DataSet())
            {
                sda.Fill(ds);
                return ds;
            }
        }
    }
}
 
 
VB.Net
Protected Sub Page_Load(sender As Object, e As EventArgs) Handles Me.Load
    If Not IsPostBack Then
        ListView1.DataSource = Me.GetData()
        ListView1.DataBind()
    End If
End Sub
 
Private Function GetData() As DataSet
    Dim conString As String = ConfigurationManager.ConnectionStrings("constr").ConnectionString
    Dim query As String = "SELECT top 10 * FROM Customers"
    Dim cmd As New SqlCommand(query)
    Using con As New SqlConnection(conString)
        Using sda As New SqlDataAdapter()
            cmd.Connection = con
            sda.SelectCommand = cmd
            Using ds As New DataSet()
                sda.Fill(ds)
                Return ds
            End Using
        End Using
    End Using
End Function
 
 
Demo
 
Downloads