Introduction
A Repeater is a Data-bound control. Data-bound controls are container controls. It creates a link between the Data Source and the presentation UI to display the data. The repeater control is used to display a repeated list of items.
A Repeater has five inline templates to format it:
-
<HeaderTemplate>
-
<AlternatingItemTemplate>
-
<Itemtemplate>
-
<SeperatorTemplate>
-
<FooterTemplate>
<HeaderTemplate>
Displays Header text for a Data Source collection and applies a different style for the Header text.
<AlternatingItemTemplate>
Changes the background color or style of alternating items in a Data Source collection.
<Itemtemplate>
It defines how the each item is rendered from the Data Source collection.
<SeperatorTemplate>
It will determine the separator element that separates each item in the item collection. It will be a <br> or <Hr> HTML element.
<FooterTemplate>
Displays a footer element for the Data Source collection.
Now, in this article I am describing the Repeater control in ASP.NET and how to create a comment page in ASP.NET .
First I created a database "EmpDetail". Then I created a table in the database.
Table Query
CREATE TABLE [dbo].[Comment](
[UserName] [nvarchar](50) NULL,
[Subject] [nvarchar](max) NULL,
[CommentOn] [nvarchar](max) NULL,
[Post_Date] [datetime] NULL
) ON [PRIMARY]
Complete Program
Repeter_Control_Example.aspx.cs
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Data;
using System.Data.SqlClient;
using System.Configuration;
public partial class Repeter_Control_Example : System.Web.UI.Page
{
SqlCommand cmd;
SqlDataAdapter da;
DataSet ds;
SqlConnection con = new SqlConnection("Data Source=.;Initial Catalog=EmpDetail;Persist Security Info=True;User ID=sa;Password=****");
protected void Page_Load(object sender, EventArgs e)
{
if (!IsPostBack)
{
RepeterData();
}
}
protected void btnSubmit_click(object sender, EventArgs e)
{
try
{
con.Open();
cmd = new SqlCommand("insert into Comment (UserName,Subject,CommentOn,Post_Date) values(@userName,@subject,@comment,@date)", con);
cmd.Parameters.Add("@userName", SqlDbType.NVarChar).Value = txtName.Text.ToString();
cmd.Parameters.Add("@subject", SqlDbType.NVarChar).Value = txtSubject.Text.ToString();
cmd.Parameters.Add("@comment", SqlDbType.NVarChar).Value = txtComment.Text.ToString();
cmd.Parameters.Add("@date", SqlDbType.DateTime).Value = DateTime.Now.Date;
cmd.ExecuteNonQuery();
con.Close();
txtName.Text = string.Empty;
txtSubject.Text = string.Empty;
txtComment.Text = string.Empty;
RepeterData();
}
catch(Exception ex)
{
txtComment.Text= ex.Message;
}
}
public void RepeterData()
{
con.Open();
cmd = new SqlCommand("Select * from Comment Order By Post_Date desc", con);
DataSet ds = new DataSet();
da = new SqlDataAdapter(cmd);
da.Fill(ds);
RepterDetails.DataSource = ds;
RepterDetails.DataBind();
}
}
Repeter_Control_Example.aspx
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Repeter_Control_Example.aspx.cs" Inherits="Repeter_Control_Example" %>
<!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 id="Head1" runat="server">
<title></title>
</head>
<body>
<form id="form1" runat="server">
<h3>Repeter Control in ASP.NET</h3>
<div">
<table>
<tr>
<td>Enter Name:</td>
<td><asp:TextBox ID="txtName" runat="server"></asp:TextBox></td>
</tr>
<tr>
<td>Enter Subject:</td>
<td><asp:TextBox ID="txtSubject" runat="server"></asp:TextBox></td>
</tr>
<tr>
<td valign="top">Enter Comments:</td>
<td><asp:TextBox ID="txtComment" runat="server" Rows="5" Columns="20" TextMode="MultiLine"></asp:TextBox></td>
</tr>
<tr>
<td></td>
<td><asp:Button ID="btnSubmit" runat="server" Text="Summit" OnClick="btnSubmit_click" /></td>
</tr>
</table>
</div>
<div>
<asp:Repeater ID="RepterDetails" runat="server">
<HeaderTemplate>
<table style="border:1px solid #0000FF; width:500px" cellpadding="0">
<tr style="background-color:#FF6600; color:#000000; font-size: large; font-weight: bold;">
<td colspan="2">
<b>Comments</b>
</td>
</tr>
</HeaderTemplate>
<ItemTemplate>
<tr style="background-color:#EBEFF0">
<td>
<table style="background-color:#EBEFF0;border-top:1px dotted #df5015; width:500px" >
<tr>
<td >
Subject:
<asp:Label ID="lblSubject" runat="server" Text='<%#Eval("Subject") %>' Font-Bold="true"/>
</td>
</tr>
</table>
</td>
</tr>
<tr>
<td>
<asp:Label ID="lblComment" runat="server" Text='<%#Eval("CommentOn") %>'/>
</td>
</tr>
<tr>
<td>
<table style="background-color:#EBEFF0;border-top:1px dotted #df5015;border-bottom:1px solid #df5015; width:500px" >
<tr>
<td >Post By: <asp:Label ID="lblUser" runat="server" Font-Bold="true" Text='<%#Eval("UserName") %>'/></td>
<td >Created Date:<asp:Label ID="lblDate" runat="server" Font-Bold="true" Text='<%#Eval("Post_Date") %>'/></td>
</tr>
</table>
</td>
</tr>
<tr>
<td colspan="2"> </td>
</tr>
</ItemTemplate>
<FooterTemplate>
</table>
</FooterTemplate>
</asp:Repeater>
</div>
</form>
</body>
</html>
Output
![RepeterExample.gif]()
For more information, download the attached sample application.