Repeater control:
The Repeater control is used to display the data items in representing list. The content and layout of list items in Repeater is defined using Templates. Every Repeater must define an ItemTemplate.
Figure 1: Repeater control.
Template:
There are the following Templates used in repeater control.
-
AlternatingItemTemplate
-
FooterTemplate
-
HeaderTemplate
-
ItemTemplate
-
SeparatorTemplate
FooterTemplate: The FooterTemplate determines the content and layout of the list footer. It is used to specify an optional footer row.
For Example:
<FooterTemplate></table></FooterTemplate>
HeaderTemplate: The HeaderTemplate determines the content and layout of the list header. It is used to specify an optional header row.
For Example:
<HeaderTemplate>
<tr>
<td><b>Roll no</b></td>
<td><b>Name</b></td>
<td><b>Course</b></td>
</tr>
</HeaderTemplate>
ItemTemplate: It defines the content and layout of items within the list.
For Example:
<ItemTemplate>
<tr>
<td><%# DataBinder.Eval(Container,"dataitem.Roll no") %></td>
<td><%# DataBinder.Eval(Container,"dataitem.Name") %></td>
<td><%# DataBinder.Eval(Container,"dataitem.Course") %></td>
</tr>
</ItemTemplate>
AlternatingItemTemplate: It is used as follows:
For Example:
<AlternatingItemTemplate>
<tr style="background-color:Yellow">
<td><%# DataBinder.Eval(Container,"dataitem.Roll no") %></td>
<td><%# DataBinder.Eval(Container,"dataitem.Name") %></td>
<td><%# DataBinder.Eval(Container,"dataitem.Course") %></td>
</tr>
</AlternatingItemTemplate>
SeparatorTemplate: The SeparatorTemplate is rendered between items (and alternating items).
Figure 2: Templates used in Repeater control.
Repeater has no built-in layout or styles. You must explicitly declare all HTML layout, formatting, and style tags within the templates of the control.
In the following section you will learn how you can access data into Repeater control from DataBase.
For Example:
To create a list within an HTML table, you might declare the <table> tag in the HeaderTemplate, a table row in the ItemTemplate, and the </table> tag in the FooterTemplate as follows-
Default.aspx file:
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="_Default" Debug="true" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" >
<head runat="server">
<title>Untitled Page</title>
</head>
<body>
<form id="form1" runat="server">
<div>
<asp:Repeater ID="Repeater1" runat="server" OnItemCommand="repeater1_itemcomand">
<HeaderTemplate>
<table border=5>
<tr>
<td><b>Roll no</b></td>
<td><b>Name</b></td>
<td><b>Course</b></td>
</tr>
</HeaderTemplate>
<ItemTemplate>
<tr>
<td><%# DataBinder.Eval(Container,"DataItem.Rollno") %></td>
<td><%# DataBinder.Eval(Container,"dataitem.Name") %></td>
<td><%# DataBinder.Eval(Container,"dataitem.Course") %></td>
</tr>
</ItemTemplate>
<AlternatingItemTemplate>
<tr style="background-color:Yellow">
<td><%# DataBinder.Eval(Container,"dataitem.Rollno") %></td>
<td><%# DataBinder.Eval(Container,"dataitem.Name") %></td>
<td><%# DataBinder.Eval(Container,"dataitem.Course") %></td>
</tr>
</AlternatingItemTemplate>
<FooterTemplate></table></FooterTemplate>
</asp:Repeater>
</div>
</form>
</body>
</html>
Design view of the above source code:
Figure 3: Repeater control using some templates.
We write the code on page load to access the table.
Default.aspx.cs:
using System;
using System.Data;
using System.Configuration;
using System.Web;
using System.Web.Security;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Web.UI.WebControls.WebParts;
using System.Web.UI.HtmlControls;
using System.Data.SqlClient;
public partial class _Default : System.Web.UI.Page
{
SqlConnection con;
SqlCommand com = new SqlCommand();
protected void Page_Load(object sender, EventArgs e)
{
con = new SqlConnection("Data Source=MCN004;Initial Catalog=student; uid=sa;pwd=");
com.Connection = con;
com.CommandText = "select * from student";
con.Open();
Repeater1.DataSource= com.ExecuteReader();
Repeater1.DataBind();
con.Close();
}
protected void repeater1_itemcomand(object source, RepeaterCommandEventArgs e)
{}
}
Output: The table in the Repeater control is look as follows:
Figure 4: Table in Repeater control.