In this article I will explain with an example, how to render (display) Repeater control as HTML Table Layout in ASP.Net using C# and VB.Net.
The Repeater control will be populated from database and the data will be displayed as HTML table on the page.
 
 

Database

Here I am making use of Microsoft’s Northwind Database. You can download it from here.
Download and install Northwind Database
 
 

HTML Markup

The following HTML Markup consists of:
Repeater – For displaying the records.
The Repeater has the following Templates:

HeaderTemplate

The content of this template will not be repeated and will be placed in the top most position i.e. head section of the Repeater control.
 

ItemTemplate

The content of this template will be repeated for each record present in its DataSource.
 

FooterTemplate

The content of this template will not be repeated and will be placed in the bottom most position i.e. footer section of the Repeater control.
<asp:Repeater ID="rptCustomers" runat="server">
    <HeaderTemplate>
        <table cellspacing="0" rules="all" border="1">
            <tr>
                <th scope="col" style="width: 80px">
                     Customer Id
                </th>
                <th scope="col" style="width: 120px">
                     Customer Name
                </th>
                <th scope="col" style="width: 100px">
                     Country
                </th>
            </tr>
    </HeaderTemplate>
    <ItemTemplate>
        <tr>
            <td><asp:Label ID="lblCustomerId" runat="server" Text='<%# Eval("CustomerId")%>' /></td>
            <td><asp:Label ID="lblContactName" runat="server" Text='<%# Eval("ContactName")%>' /></td>
            <td><asp:Label ID="lblCompanyName" runat="server" Text='<%# Eval("Country")%>' /></td>
        </tr>
    </ItemTemplate>
    <FooterTemplate>
        </table>
    </FooterTemplate>
</asp:Repeater>
 
 

Namespaces

You will need to import the following namespaces.
C#
using System.Data;
using System.Data.SqlClient;
using System.Configuration;
 
VB.Net
Imports System.Data
Imports System.Data.SqlClient
Imports System.Configuration
 
 

Rendering Repeater control as HTML Table Layout in ASP.Net

Inside the Page Load event handler, the Repeater is populated with Top 10 records from the Customers table of the Northwind database.
C#
protected void Page_Load(object sender, EventArgs e)
{
    if (!this.IsPostBack)
    {
        this.BindRepeater();
    }
}
 
private void BindRepeater()
{
    string constr = ConfigurationManager.ConnectionStrings["constr"].ConnectionString;
    using (SqlConnection con = new SqlConnection(constr))
    {
        using (SqlCommand cmd = new SqlCommand("SELECT TOP 10 * FROM Customers", con))
        {
            using (SqlDataAdapter sda = new SqlDataAdapter(cmd))
            {
                DataTable dt = new DataTable();
                sda.Fill(dt);
                rptCustomers.DataSource = dt;
                rptCustomers.DataBind();
            }
        }
    }
}
 
VB.Net
Protected Sub Page_Load(sender As Object, e As EventArgs) Handles Me.Load
    If Not Me.IsPostBack Then
        Me.BindRepeater()
    End If
End Sub
 
Private Sub BindRepeater()
    Dim constr As String = ConfigurationManager.ConnectionStrings("constr").ConnectionString
    Using con As New SqlConnection(constr)
        Using cmd As New SqlCommand("SELECT TOP 10 * FROM Customers", con)
            Using sda As New SqlDataAdapter(cmd)
                Dim dt As New DataTable()
                sda.Fill(dt)
                rptCustomers.DataSource = dt
                rptCustomers.DataBind()
            End Using
        End Using
    End Using
End Sub
 
 

Screenshot

Display and render Repeater control as HTML Table Layout in ASP.Net
 
 

Demo

View Demo
 
 

Downloads

Download Code