In this article we are going to discuss ASP.NET Repeater Controls in the detail and How to use repeater controls in ASP.NET.
Intro:
ASP.NET repeater control is used to display repeated records that are bound to the controls. Repeater control can be bound to database records, XML, or with the list of items. Repeater control is a data bind control and creates a link between source of record (Database) and presentation UI to display records.
In short repeater control in simple container that display specific database records in the table form. It provides different layouts to display the records. It doesn’t have any built-in layout so we have to declare custom layout or style tags explicitly in the control template.
Following are 5 inline template to format repeater control records.
- <HeaderTemplate>
- <ItemTemplate>
- <FooterTemplate>
- <AlternatingItemTemplate>
- <SeperatorTemplate>
HeaderTemplate:
HeaderTemplate is used to render header once before rendering the the ItemTemplate section of records.
ItemTemplate:
ItemTemplate is used to render the list of items or the list of records in the form of table rows.
FooterTemplate:
FooterTemplate is used to render footer data after the ItemTemplate section. This template is mostly used to show paging etc.
AlternatingItemTemplate:
AlternatingItemTemplate is used to render every second row element and it works only on even numbers. Background colours can be alternate with this template.
SeperatorTemplate:
SeperatorTemplate is used to separate two element records or rows like line break.
Important points about ASP.NET Repeater Control:
Repeater controls are used to show multiple records and it used for backend records.
Repeater controls do not have any theme layout it. If we need any styling or layout we have to customize it with styling tags.
Repeater controls are only web controls that allows us to split markup tags across the template. We cam create a table using template by adding <table> tag to the HeaderTemplate, <tr> tag to the the ItemTemplate and we will close the table by closing </table> tage to the FooterTemplate.
How to use ASP.NET Repeater Control:
Lets have a look at the example I’m going to show you. How to create a repeater control in ASP.NET and bind data to it.
Repreatercontrol.aspx
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="RepeaterControlPage.aspx.cs" Inherits="RepeaterControlExample.RepeaterControlPage" %>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
<style>
.header {
background-color:#808080;
color:#ffffff;
width:100%;
}
.item {
background-color:#ffffff;
width:100%;
}
.alternativeitem {
background-color:#0094ff;
color:#ffffff;
width:100%;
}
</style>
</head>
<body>
<form id="form1" runat="server">
<div>
<asp:Repeater runat="server" ID="rptStudent">
<HeaderTemplate>
<table>
<tr class="header">
<th>
<b>Student Id</b>
</th>
<th>
<b>Name</b>
</th>
<th>
<b>Address</b>
</th>
<th>
<b>Roll No</b>
</th>
</tr>
</HeaderTemplate>
<ItemTemplate>
<tr class="item">
<td>
<%# Eval("StudentId") %>
</td>
<td>
<%# Eval("Name") %>
</td>
<td>
<%# Eval("Address") %>
</td>
<td>
<%# Eval("RollNo") %>
</td>
</tr>
</ItemTemplate>
<AlternatingItemTemplate>
<tr class="alternativeitem">
<td>
<%# Eval("StudentId") %>
</td>
<td>
<%# Eval("Name") %>
</td>
<td>
<%# Eval("Address") %>
</td>
<td>
<%# Eval("RollNo") %>
</td>
</tr>
</AlternatingItemTemplate>
<FooterTemplate>
<tr>
<td colspan="4">
<b>Footer, use for paging</b>
</td>
</tr>
</table>
</FooterTemplate>
</asp:Repeater>
</div>
</form>
</body>
</html>
Repeatercontrol.aspx.cs
using System;
using System.Collections.Generic;
using System.Data;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
namespace RepeaterControlExample
{
public partial class RepeaterControlPage : System.Web.UI.Page
{
protected void Page_Load(object sender, EventArgs e)
{
if (!Page.IsPostBack)
{
GetStudentList();
}
}
public void GetStudentList()
{
DataTable dtStudent = new DataTable();
dtStudent.Columns.Add("StudentId",typeof(int));
dtStudent.Columns.Add("Name", typeof(string));
dtStudent.Columns.Add("Address", typeof(string));
dtStudent.Columns.Add("RollNo", typeof(int));
dtStudent.Rows.Add(101, "Rahul Singh", "New Delhi", 1);
dtStudent.Rows.Add(102, "Mahesh Kumar", "Punjabi Bagh", 2);
dtStudent.Rows.Add(103, "Mandeep Singh", "Jashola", 3);
dtStudent.Rows.Add(104, "Banky", "Ashok Nagar", 4);
dtStudent.Rows.Add(105, "Mukesh Kumar", "Nangloi", 5);
try
{
if (dtStudent.Rows.Count > 0)
{
rptStudent.DataSource = dtStudent;
rptStudent.DataBind();
}
}
catch (Exception ex)
{
throw ex;
}
}
}
}
Conclusion:
In this article, we have discuss ASP.NET Repeater controls and learned how can we implement this in our application. If you have any suggestion to improve ourself or have any query to ask. Do not hesitate to contact us or you can comment below.
