The Repeater control is used to display a repeated list of
items that are bound to the control. It enable the customization of the layout
by each repeated list of items. The Repeater control may be bound to a database
table, an XML file, or another list of items. The Repeater control has no
built-in select and edit support.
Uses of Repeater Control
Repeater Control is used to display repeated list of items
that are bound to the control and it's same as grid view and data grid view.
Repeater control is lightweight and faster to display data when compared with
grid view and data grid. By using this control we can display data in custom
format but it's not possible in grid view or data grid view and it doesn't support
for paging and sorting.
The Repeater control works by looping through the records in
your data source and then repeating the rendering of it's templates called item
template. Repeater control contains different types of template fields those
are
1) itemTemplate
2) AlternatingitemTemplate
3) HeaderTemplate
4) FooterTemplate
5) SeperatorTemplate
ItemTemplate: ItemTemplate defines how the each item is
rendered from data source collection.
AlternatingItemTemplate: AlternatingItemTemplates is used to
change the background color and styles of Alternating Items in Data Source collection
HeaderTemplate: HeaderTemplate is used to display Header
text for Data Source collection and apply different styles for header text.
FooterTemplate: FooterTemplate is used to display footer
element for Data Source collection
SeparatorTemplate: SeparatorTemplate will determine
separator element which separates each Item in Item collection. Usually, Separate Template will be <br> html element or <hr> html element.
Now I am showing Repeater Control with the help of an example..
Image 1.
Table I used for this example..
Image 2.
ASPX code for this...
<%@ Page Language="C#"
AutoEventWireup="true"
CodeFile="Default.aspx.cs"
Inherits="_Default"
%>
<!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>Repeator
Control Example</title>
</head>
<body>
<form id="form1" runat="server">
<div>
<table cellpadding="2" cellspacing="2" width="70%" align="center" border="1">
<tr>
<td>
<table cellpadding="2" cellspacing="2" width="70%" align="center">
<tr>
<td style="color: Black;">
Your Name:
</td>
<td>
<asp:TextBox ID="txtName"
runat="server"
Width="200px"
/>
</td>
</tr>
<tr>
<td style="color: Black;">
Enter Title:
</td>
<td>
<asp:TextBox ID="txtTitle"
runat="server"
Width="500px"
/>
</td>
</tr>
<tr>
<td valign="top"
style="color: Black;">
Enter
Description:
</td>
<td>
<asp:TextBox ID="txtDescription"
runat="server"
Rows="5"
Columns="20"
TextMode="MultiLine"
Width="500px" />
</td>
</tr>
<tr>
<td>
</td>
<td>
<asp:Button ID="btnSubmit"
runat="server"
Text="Post
Blog" OnClick="btnSubmit_Click" />
</td>
</tr>
<tr>
<td colspan="5">
<asp:Repeater ID="RepDetails"
runat="server">
<HeaderTemplate>
<table style="border: 1px solid #3399FF; width: 500px" cellpadding="0">
<tr style="background-color: #088A29;
color: White">
<td
colspan="2">
<b>All Blogs</b>
</td>
</tr>
</HeaderTemplate>
<ItemTemplate>
<tr style="background-color: #CCCCFF">
<td>
<table
style="background-color: #66CCCC;
border-top: 1px dotted #df5015; width: 500px">
<tr>
<td
style="color: Black;">
Title:
<asp:Label ID="lblTitle" runat="server" Text='<%#Eval("Title")
%>' Font-Bold="true" />
</td>
</tr>
</table>
</td>
</tr>
<tr>
<td>
<asp:Label ID="lblDescription"
runat="server"
Text='<%#Eval("Description")
%>' />
</td>
</tr>
<tr>
<td>
<table
style="background-color: #EBEFF0;
border-bottom: 1px
solid #df5015; width: 500px">
<tr>
<td>
Post By:
<asp:Label ID="lblUser"
runat="server"
Font-Bold="true"
Text='<%#Eval("PostedBy")
%>' />
</td>
<td>
Created Date:<asp:Label
ID="lblDate"
runat="server"
Font-Bold="true"
Text='<%#Eval("PostedDate")
%>' />
</td>
</tr>
</table>
</td>
</tr>
</ItemTemplate>
<FooterTemplate>
</table>
</FooterTemplate>
</asp:Repeater>
</td>
</tr>
</table>
</td>
</tr>
</table>
</div>
</form>
</body>
</html>
aspx.cs code
using System;
using
System.Configuration;
using
System.Data;
using
System.Linq;
using
System.Web;
using
System.Web.Security;
using
System.Web.UI;
sing
System.Web.UI.HtmlControls;
using
System.Web.UI.WebControls;
using
System.Web.UI.WebControls.WebParts;
using
System.Xml.Linq;
using
System.Data;
using
System.Data.SqlClient;
public partial class _Default : System.Web.UI.Page
{
private SqlConnection con = new
SqlConnection(@"Data
Source=.;Initial Catalog=MyDb;Integrated Security=true");
protected void Page_Load(object
sender, EventArgs e)
{
if
(!IsPostBack)
{
BindBlog();
}
}
protected void BindBlog()
{
con.Open();
SqlCommand
cmd = new SqlCommand("SELECT * FROM MyBlog ORDER BY ID desc",
con);
DataSet
ds = new DataSet();
SqlDataAdapter
da = new SqlDataAdapter(cmd);
da.Fill(ds);
RepDetails.DataSource = ds;
RepDetails.DataBind();
con.Close();
}
protected void btnSubmit_Click(object
sender, EventArgs e)
{
con.Open();
SqlCommand
cmd = new SqlCommand("INSERT INTO MyBlog (Title,Description,PostedBy,PostedDate)
values(@Title,@Description,@PostedBy,@PostedDate)",
con);
cmd.Parameters.AddWithValue("@Title", txtTitle.Text);
cmd.Parameters.AddWithValue("@Description", txtDescription.Text);
cmd.Parameters.AddWithValue("@PostedBy", txtName.Text);
cmd.Parameters.AddWithValue("@PostedDate", DateTime.Now);
cmd.ExecuteNonQuery();
con.Close();
txtName.Text = string.Empty;
txtTitle.Text = string.Empty;
txtDescription.Text = string.Empty;
BindBlog();
}
}