The Repeater control is a lightweight control but has many uses and has become a favorite of mine. Many developers do not realize that you can use templates with the Repeater. It has a limited set of templates, with few properties, but you can make use of them as this article demonstrates.
By: John Kilgo
Date: June 14, 2003 Download the code. Printer Friendly VersionThe Repeater web control allows you (or forces upon you if you prefer) great freedom to control the output of your data. It has no inbuilt display method. You must tell it exactly how to display the data. This may seem to be forcing more work on you when you compare it to the Datagrid, but there are times when a strictly tabular presentation is not what you want. In those cases the repeater is easier to deal with than a Datagrid or a Datalist.
The default page of dotnetjohn.com uses two repeaters. The top 10 articles by page views and top 10 articles by article rating sections are both repeaters. Also, if you have used the search engine on dotnetjohn.com, the search results page is a Repeater control.
In this article we will examine using the templates that are available for use with the Repeater control. They are limited both in number and especially in properties that can be set, but they do allow you a certain amount of control. We will display the Employees table from the Northwind database in the article. Now lets get to the code. Unlike most code on dotnetjohn.com the meat of the article will deal with the .aspx file. The code-behind file just connects to the database and sets the datasource for the Repeater control.
First the .aspx file. The code should be simple enough that I'm not going to go through it line by line. You should notice that we have used an in-line style sheet to make it easier to control the coloring of the ItemTemplate and AlternatingItemTemplate items. You should also notice that we have used all of the templates available to the Repeater control, namely the HeaderTemplate, the ItemTemplate, the AlternatingItemTemplate, the SeparatorTemplate, and the FooterTemplate. Thats about all there is to it. I just wanted to show that the templates are available for your use.
<%@ Page Language="vb" AutoEventWireup="false" Src="RepeaterTemplate.aspx.vb" Inherits="RepeaterTemplate"%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<html>
<head>
<title>RepeaterTemplate</title>
<meta name="GENERATOR" content="Microsoft Visual Studio.NET 7.0">
<meta name="CODE_LANGUAGE" content="Visual Basic 7.0">
<meta name=vs_defaultClientScript content="JavaScript">
<meta name=vs_targetSchema content="http://schemas.microsoft.com/intellisense/ie5">
<style rel="StyleSheet">
.tablebody
{
font-family: Verdana, Arial, Helvetica, Sans-Serif;
color:Black;
font-size: 10pt;
}
.alttablebody
{
font-family: Verdana, Arial, Helvetica, Sans-Serif;
color:Green;
font-size: 10pt;
}
</style>
</head>
<body MS_POSITIONING="GridLayout">
<form id="Form1" method="post" runat="server">
<asp:Repeater ID="rptEmps"
Runat="server">
<HeaderTemplate>
<table>
<tr>
<th colspan="2">
<font face="verdana" size="2">
Listing of Employees and Home Telephone Numbers
</font>
</th>
</tr>
<tr><td colspan="2"> </td></tr>
</HeaderTemplate>
<ItemTemplate>
<tr class="tablebody">
<td>
<%# DataBinder.Eval(Container.DataItem, "LastName") & ", " _
& DataBinder.Eval(Container.DataItem, "FirstName") %>
</td>
<td>
<%# DataBinder.Eval(Container.DataItem, "HomePhone") %>
</td>
</tr>
</ItemTemplate>
<AlternatingItemTemplate>
<tr class="alttablebody">
<td>
<%# DataBinder.Eval(Container.DataItem, "LastName") & ", " _
& DataBinder.Eval(Container.DataItem, "FirstName") %>
</td>
<td>
<%# DataBinder.Eval(Container.DataItem, "HomePhone") %>
</td>
</tr>
</AlternatingItemTemplate>
<SeparatorTemplate>
<tr>
<td colspan="2"><hr></td>
</tr>
</SeparatorTemplate>
<FooterTemplate>
<tr><td colspan="2"> </td></tr>
<tr>
<td colspan="2" align="center">
<font color="red">-- End of Listing --</font>
</td>
</tr>
</table>
</FooterTemplate>
</asp:Repeater>
</form>
</body>
</html>
Now for the code-behind file. As you can see, all we are doing is connecting to the database, doing a SELECT from the Employees table, setting the datasource and binding the repeater. That is all we need to do.
Imports System.Data
Imports System.Data.SqlClient
Imports System.Configuration
Public Class RepeaterTemplate
Inherits System.Web.UI.Page
Protected rptEmps As System.Web.UI.WebControls.Repeater
Private Sub Page_Load(ByVal sender As System.Object, ByVal e As System.EventArgs) Handles MyBase.Load
If Not IsPostBack Then
Dim strSql As String = "Select LastName, FirstName, HomePhone From Employees Order By LastName"
Dim objConn As New SqlConnection(ConfigurationSettings.AppSettings("NorthwindConnection"))
Dim objCmd As New SqlCommand(strSql, objConn)
Try
objConn.Open()
rptEmps.DataSource = objCmd.ExecuteReader()
rptEmps.DataBind()
Catch exc As SqlException
Response.Write(exc.ToString())
Finally
objConn.Dispose()
End Try
End If
End Sub
End Class
This article has been short and to the point, but I hope it will encourage you to give the Repeater control a try. I have found it very useful in my applications. It has come in handy on dotnetjohn.com with less fuss and expense than the Datagrid.
You may run the program here.
You may download the code here.