ASP.NET Tutorial.

How to use Repeater

Publish date: Tuesday October 28, 2008

In this article, I'll show you how to use Repeater in

ASP.NET page.
Here is an example of Repeater:

I store the user in table "Client_NetroStar" in SQL Server.  There are five fields in the table:

 ID
 Login
 FirstName
 LastName
 DateAdded

1. First Step - Insert the Repeater Control on page.

Repeater control allows you to create templates. For example you can use a template to
customize the layout of the individual rows.

 HeaderTemplate - template for elements that you want to render once before your
ItemTemplate section.
 ItemTemplate - template for elements that are rendered once per row of data.
 AlternatingItemTemplate - template for elements that are rendered every other row of
data. This allows you to alternate background colors, for example.
 SeparatorTemplate - template for elements to render between each row, such as line
breaks.
 FooterTemplate - template for elements that you want to render once after your
ItemTemplate section.

Here is the part of the “ClientNetroStar.aspx” page that contains Repeater:

view plaincopy to clipboardprint?
1. <asp:Repeater ID="rptList" runat="server" OnItemDataBound="rptList_ItemDataBound"> 
 
2.    <HeaderTemplate>  
3.       <table>  
4.          <tr>  
5.             <th>  
6.                <asp:Label ID="Label14" Text="Login" runat="server"></asp:Label>  
7.             </th>  
8.             <th>  
9.                <asp:Label ID="Label1" Text="First Name" runat="server"></asp:Label
>  
10.             </th>  
11.             <th>  
12.                <asp:Label ID="Label2" Text="Last Name" runat="server"></asp:Label> 
 
13.             </th>  
14.             <th>  
15.                <asp:Label ID="Label3" Text="Date Added" runat="server"></asp:Label
>  
16.             </th>  
17.             <th>  
18.                <asp:Label ID="Label6" Text="Delete" runat="server"></asp:Label>  
19.             </th>  
20.          </tr>  
21.    </HeaderTemplate>  
22.    <ItemTemplate>  
23.       <tr>  
24.          <td>  
25.             <asp:LinkButton ID="lbnLogin" Text='<<%# Eval("Login") %>' runa
t="server"  
26.                OnClick="lnkClient_Click" CommandArgument='<<%# Eval
("ID").ToString() %>'>  
27.             </asp:LinkButton>  
28.          </td>  
29.          <td>  
30.             <asp:LinkButton ID="lbnFirstName" Text='<<%# Eval
("FirstName").ToString() %>' runat="server"  
31.                OnClick="lnkClient_Click" CommandArgument='<<%# Eval
("ID").ToString() %>'>  
32.             </asp:LinkButton>  
33.          </td>  
34.          <td>  
35.             <asp:LinkButton ID="LinkButton2" Text='<<%# Eval
("LastName").ToString() %>' runat="server"  
36.                OnClick="lnkClient_Click" CommandArgument='<<%# Eval
("ID").ToString() %>'>  
37.             </asp:LinkButton>  
38.          </td>  
 39.          <td>  
40.             <asp:LinkButton ID="LinkButton1" Text='<<%# Eval("DateAdded") %>' runa
t="server"  
41.                OnClick="lnkClient_Click" CommandArgument='<<%# Eval
("ID").ToString() %>'>  
42.             </asp:LinkButton>  
43.          </td>  
44.          <td>  
45.             <asp:LinkButton ID="lbnDelete" Text="delete"  runat="server"    
46.                OnClick="lbnDelete_Click" CommandArgument='<<%# Eval
("ID").ToString() %>'>  
47.             </asp:LinkButton>  
48.          </td>  
49.       </tr>  
50.    </ItemTemplate>  
51.    <FooterTemplate>  
52.       </table>  
53.    </FooterTemplate>  
54.  </asp:Repeater>  
<asp:Repeater ID="r ptList" runat="serv er" OnItemDataBound="r
<Header Template>
<table>
<tr>
<th>
<asp:Label ID="Label14" Text="Login" runat="serv er">
</th>
<th>
<asp:Label ID="Label1" Text="First Name" runat="s erv
</th>
<th>
<asp:Label ID="Label2" Text="Last Name" runat="s erv
</th>
<th>
<asp:Label ID="Label3" Text="Date A dded" runat="se
</th>
<th>
<asp:Label ID="Label6" Text="Delete" r unat="ser ver">
</th>
</tr>
</Header Template>
<ItemTemplate>
<tr >
<td>
<asp:LinkButton ID="lbnLogin" Text='<%# Eval("Login")
OnClick="lnkClient_Click" CommandA rgument='<%# Ev
</asp:LinkButton>
</td>
<td>
<asp:LinkButton ID="lbnFirstName" Text='<%# Eval("Fir s
OnClick="lnkClient_Click" CommandA rgument='<%# Ev
</asp:LinkButton>
</td>
<td>
<asp:LinkButton ID="LinkButton2" Text='<%# Ev al( "Last
OnClick="lnkClient_Click" CommandA rgument='<%# Ev
</asp:LinkButton>
</td>
<td>
<asp:LinkButton ID="LinkButton1" Text='<%# Ev al( "Date
OnClick="lnkClient_Click" CommandA rgument='<%# Ev
</asp:LinkButton>
</td>
<td>
<asp:LinkButton ID="lbnDelete" Text="delete" runat="s e
OnClick="lbnDelete_Click" CommandA r gument='<%# E
</asp:LinkButton>
</td>
</tr >
</ItemTemplate>
<FooterTemplate>
</table>
</FooterTemplate>
</asp:Repeater >

The Repeater has an attribute ID= "rptList". It is used in  Code Behind
(ClientNetroStar.aspx.cs) . Repeater uses the HeaderTemplate to insert <table> .  Then it uses the
ItemTemplate to display a LinkButton control that has our data in it. I'll come back to this in the
next  step.

The FooterTemplate is not necessary, but I put it in </table>.

2. Second Step - Get the Data to Repeater.

Here is the Page_Load event in the Code Behind file.
view plaincopy to clipboardprint?
1. protected void Page_Load(object sender, EventArgs e)    
2. {    
 3.    SqlConnection con = new SqlConnection("Server=xxxxxxx;UID=xxxx;PWD=xxxxx;Databa
se=NetroStar\Server");    
4.    string sSQL = "Select * from Client_NetroStar";    
5.    SqlCommand cmd = new SqlCommand(sSQL, con);    
6.    con.Open();   
7.    SqlDataReader dtrClient = cmd.ExecuteReader();   
8.    rptList.DataSource = dtrClient;   
9.    rptList.DataBind();   
10.    con.Close();   
11. }   

protected void Page_Load(object sender, EventArgs e)

{
SqlConnection con = new SqlConnection("Server=xxxxxxx;U
string sSQL = "Select * from Client_NetroStar";
SqlCommand cmd = new SqlCommand(sSQL, con);
con.Open();
SqlDataReader dtrClient = cmd.ExecuteReader();
rptList.DataSource = dtrClient;
rptList.DataBind();
con.Close();
}

The first five lines open a database connection and retrieve the contents of the Client_NetroStar
table. The last two lines bind our Repeater control to the DataReader.