Online Training for Asp.net MVC Web Designing Development, MS SQL, Digital Marketing

Repeater Example in Asp.net Application

How to use Repeater control in Asp.Net

Repeater control is best when you have big amount of data to display only, Repeater is a light object compare to GridView, generates less amount of viewState, so page become faster and lighter, you also can turn off viewstate if you have nothing to do after displaying the data

In this example we will quickly fetch some data from database using DataSet and learn to work with Asp.net Repeater control

(Note: ideally you should use DataReader to read only big amount of data, but in this repeater example I am trying to keep ado.net code as minimum as possible)

Step 1: write a data access method like dataset / dataeader or custom object collection that will get you the data from database.
public DataSet getStudentDataset()
{
DataSet ds = new DataSet();
using (SqlConnection con = new SqlConnection(Util.ConnectionString))
{
SqlDataAdapter _sda = new SqlDataAdapter("Select * from tbStudent", con);
_sda.Fill(ds);
}
return ds;
}

Step 2: Add a Repeater control in your aspx file.
<asp:Repeater ID="repStudent" runat="server"></asp:Repeater>

Step 3: write a method in your aspx.cs codebehind to set the DataSource property of asp.net Repeater control
void displayStudents()
{
DataTable dt = null;

using (StudentDTO dto = new StudentDTO())
{
dt = dto.getStudentDataset().Tables[0];

repStudent.DataSource = dt;
repStudent.DataBind();
}
}

Step 4: Call the method inside page load event, consider isPostback wherever necessary
protected void Page_Load(object sender, EventArgs e)
{
displayStudents();
}


Step 5: Setup the values in Repeater Template as displayed below, we learn each Template in Repeater now
<asp:Repeater ID="repStudent" runat="server">
<HeaderTemplate>
<table style="width:60%;">
<tr>
<td>Name</td>
<td>Contact No</td>
<td>Address</td>
</tr>
</HeaderTemplate>
<ItemTemplate>
<tr>
<td><%#Eval("FullName") %></td>
<td><%#Eval("contactnumber") %></td>
<td><%#Eval("updatedon") %></td>
</tr>
</ItemTemplate>
<AlternatingItemTemplate>
<tr style="background-color:#e8e8e8">
<td><%#Eval("FullName") %></td>
<td><%#Eval("contactnumber") %></td>
<td><%#Eval("updatedon") %></td>
</tr>
</AlternatingItemTemplate>
<FooterTemplate>
</table>
</FooterTemplate>
</asp:Repeater>

Templates in Asp.net Repeater Control

Inside the Repeater there is a Table to display the data, You can use some CSS for Table to make the table beautiful
Template Type Description
HeaderTemplate This section is for designing the header part of table inside the repeater control
ItemTemplate This template contain row of table, all data are displayed here
AlternatingItemTemplate This template is same as ItemTemplate, only to display different color or each alternate row
FooterTemplate This is the bottom part of the table, where you can display total row cont or pagination etc.

Events in Asp.net Repeater Control

Event Description
ItemDataBound ItemDataBound only during databinding, this event has RepeaterItemEventArgs, if you need e.Item.DataItem of current row then use this event
ItemCreated ItemCreated is fired on the roundtrips as well (postbacks), this event has RepeaterItemEventArgs
Repeater ItemDataBound Example in Asp.net
Here is How to fire button click event in ASP.NET Repeater Control, For example you have a button in repeater itemTemplate , on that button click you want to know the information of current row.
So, you need mention ID,CommandName and CommandArgument of the button inside itemtemplate
<ItemTemplate>
<div>
<asp:Button runat="server" ID="btnShowDetails" Text="Show Details" CommandName="showDetails" CommandArgument='<%#Eval("FullName") %>' />
</div>
</ItemTemplate>


Now in ItemDataBound event find out the button and the value of CommandArgument
protected void repStudent_ItemDataBound(object sender, RepeaterItemEventArgs e)
{
if (e.Item.ItemType == ListItemType.Item || e.Item.ItemType == ListItemType.AlternatingItem)
{
Button btn = (Button)e.Item.FindControl("btnShowDetails");
string _currentName = btn.CommandArgument;
btn.Attributes.Add("onclick", "window.alert('" + _currentName + "')");
}
}
Add OnItemDataBound="repStudent_ItemDataBound" in your Repeater control in aspx file.
Repeater ItemCreated Example in Asp.net
ItemCreated event in Repeater occurs every time (regardless postback), so if you have five rows in a repeater and you click a button on any particular row, ItemCreated even will occur for the entire row, so if you want anything to happen in general if any row button click, then use this event.

One more thing you should notice that CommandArgument value will be always null but you can get the CommandName value, which will be same for all the row. Here is an example
protected void repStudent_ItemCreated(object sender, RepeaterItemEventArgs e)
{
if (e.Item.ItemType == ListItemType.Item || e.Item.ItemType == ListItemType.AlternatingItem)
{
Button btn = (Button)e.Item.FindControl("btnShowDetails");

//CommandArgument will be always null
string _commandArgument = btn.CommandArgument;

// can use the CommandName value
string _commandName = btn.CommandName;
}
}
Add OnItemCreated="repStudent_ItemCreated" in your Repeater control in aspx file.

Comment
Name Email Website
Subscribe
 
Repeater Example in Asp.net Application

Asp.net Repeater ItemDataBound, ItemCreated Example
Group Training