Repeater Control In ASP.NET

Repeater control is a light weight control as compared to GridView control. It is not having default functionality as GridView. 

In repeater control we have to design our own rows, columns or designing our layouts.

  1. Create a new ASP.NET Empty Web Site.

    Click on File - WebSite - ASP.NET Empty Web Site.

    new

  2. By default only one file created in project that is Web.Config.

    Config 

  3. Right click on project, Add, then Add a New Item,

    Select WebForm and give name “Repeater.aspx

    web form

  4. Select ToolBox’s Data group and then Repeater control. Drag and drop on Repeater page.

    ToolBox 

  5. Basic structure of repeater control,
    1. <asp:Repeater ID="rp" runat="server">  
    Your code will come here,
    1. </asp:Repeater>  
  6. Before starting coding of repeater layouts of columns and rows first create table structure in your database as given below.
    1. SET ANSI_NULLS ON  
    2. GO  
    3. SET QUOTED_IDENTIFIER ON  
    4. GO  
    5. SET ANSI_PADDING ON  
    6. GO  
    7. CREATE TABLE[dbo].[tblFriends]  
    8. (  
    9.     [FriendID][int] IDENTITY(1, 1) NOT NULL, [FriendName][varchar](50) NULL, [Place][varchar](25) NULL, [Mobile][varchar](15) NULL, [EmailAddress][varchar](150) NULL  
    10. )   
    11. ON[PRIMARY]  
    12.   
    13. GO  
    14. SET ANSI_PADDING OFF  
  7. Now, switch back to Repeater.aspx page, we started coding of ASPX page.
    1. <%@ Page Language="C#" AutoEventWireup="true" CodeFile="Repeater.aspx.cs" Inherits="Repeater" %>  
    2.   
    3.     <!DOCTYPE html>  
    4.   
    5.     <html xmlns="http://www.w3.org/1999/xhtml">  
    6.   
    7.     <head runat="server">  
    8.         <title></title>  
    9.     </head>  
    10.   
    11.     <body>  
    12.         <form id="form1" runat="server">  
    13.             <div>  
    14.   
    15.                 <asp:Repeater ID="rptFriend" runat="server">  
    16.                     <ItemTemplate>  
    17.                         <table>  
    18.                             <tr>  
    19.                                 <td><b>Friend ID :</b>  
    20.                                     <asp:Label ID="lblFriendID" runat="server" Text='<%# Eval("FriendID")%>'></asp:Label>  
    21.                                     <br />  
    22.                                     <b>Friend Name :</b>  
    23.                                     <asp:Label ID="lblFriendName" runat="server" Text='<%# Eval("FriendName") %>'></asp:Label>  
    24.                                     <br />  
    25.                                     <b>Place :</b>  
    26.                                     <asp:Label ID="lblPlace" runat="server" Text='<%# Eval("Place") %>'></asp:Label>  
    27.                                     <br />  
    28.                                     <b>Mobile :</b>  
    29.                                     <asp:Label ID="lblMobile" runat="server" Text='<%# Eval("Mobile") %>'></asp:Label>  
    30.                                     <br />  
    31.                                     <b>Email Address:</b>  
    32.                                     <asp:Label ID="lblEmailAddress" runat="server" Text='<%# Eval("EmailAddress") %>'></asp:Label>  
    33.                                 </td>  
    34.                             </tr>  
    35.                         </table>  
    36.                     </ItemTemplate>  
    37.                     <SeparatorTemplate>  
    38.                         <hr/>  
    39.                     </SeparatorTemplate>  
    40.                 </asp:Repeater>  
    41.   
    42.             </div>  
    43.         </form>  
    44.     </body>  
    45.   
    46.     </html>  
  8. In design view ASPX will look like the following:

    ASPX
     
  9. Right click on project Add Reference, Assemblies, then Framework,

    Select System.Configuration.dll

    Reference

  10. Add following namespace in REPEATER.ASPX.CS
    1. using System.Data;   
    2. using System.Data.SqlClient;  
    3. using System.Configuration;  
    Using System.Data: The namespace to access ADO.NET full functionalities.
    Using System.Data.SqlClient: The namespace to access SQL Server database.
    Using System.Configuration: To fetch connection string from web.config.

  11. Now, switch to Repeater.aspx.cs page, we starting coding of code behind file.
    1. using System;  
    2. using System.Collections.Generic;  
    3. using System.Configuration;  
    4. using System.Data;  
    5. using System.Data.SqlClient;  
    6. using System.Linq;  
    7. using System.Web;  
    8. using System.Web.UI;  
    9. using System.Web.UI.WebControls;  
    10.   
    11. public partial class Repeater: System.Web.UI.Page   
    12. {  
    13.   
    14.     string ConStr = ConfigurationManager.ConnectionStrings["MemberCDACConnectionString"].ConnectionString;  
    15.   
    16.     protected void Page_Load(object sender, EventArgs e)   
    17.     {  
    18.         if (!IsPostBack)   
    19.         {  
    20.             BindRepeater();  
    21.         }  
    22.     }  
    23.   
    24.     /// <summary>  
    25.     /// To load data into Repeater control  
    26.     /// </summary>  
    27.     public void BindRepeater()  
    28.     {  
    29.   
    30.         SqlConnection con = new SqlConnection(ConStr);  
    31.         SqlDataAdapter da = new SqlDataAdapter("Select * From tblFriends", ConStr);  
    32.         DataSet ds = new DataSet();  
    33.         da.Fill(ds, "FriendTable");  
    34.         rptFriend.DataSource = ds;  
    35.         rptFriend.DataBind();  
    36.     }  
    37. }  
  12. Repeater view

    Repeater

In the next article we will learn two main events of REPEATER,

  • ItemCommand
  • ItemDataBound.

Please, feel free to contact for any query and keep in check for next article.