Share via


Repeater Web Server Control

Creates a data-bound list control that allows custom layout by repeating a specified template for each item displayed in the list.

<asp:Repeater id="Repeater1" 
     DataSource="<% databindingexpression %>"
     runat=server>

   <HeaderTemplate>
      Header template HTML
   </HeaderTemplate>
   <ItemTemplate>
      Item template HTML
   </ItemTemplate>
   <AlternatingItemTemplate>
      Alternating item template HTML
   </AlternatingItemTemplate>
   <SeparatorTemplate>
      Separator template HTML
   </SeparatorTemplate>
   <FooterTemplate>
      Footer template HTML
   </FooterTemplate>

<asp:Repeater>

Remarks

Use the Repeater control to create a basic templated data-bound list. The Repeater control has no built-in layout or styles; you must explicitly declare all HTML layout, formatting, and style tags within the control's templates.

The Repeater control is different from other data list controls in that it allows you to place HTML fragments in its templates. This allows you to create a complex HTML structure, such as a table. For example, to create a list within an HTML table, start the table by placing the <table> tag in the HeaderTemplate. Next, create the rows and columns of the table by placing <tr> tags, <td> tags, and data-bound items in the ItemTemplate. If you want a different appearance for alternating items in the table, create an AlternatingItemTemplate with the same contents as the ItemTemplate, except with a different style specified. Finally, complete the table by placing the </table> tag in the FooterTemplate.

The following table lists the different templates of the Repeater control.

Template Description
AlternatingItemTemplate Like the ItemTemplate element, but rendered for every other row (alternating items) in the Repeater control. You can specify a different appearance for the AlternatingItemTemplate element by setting its style properties.
FooterTemplate Elements to render once, after all data-bound rows have been rendered. A typical use is to close an element opened in the HeaderTemplate item (with a tag such as </table>).
Note   The FooterTemplate cannot be data bound.
HeaderTemplate Elements to render once, before any data-bound rows have been rendered. A typical use is to begin a container element, such as a table.
Note   The HeaderTemplate item cannot be data bound.
ItemTemplate Elements that are rendered once for each row in the data source. To display data in the ItemTemplate, declare one or more Web server controls and set their data-binding expressions to evaluate to a field in the Repeater control's (that is, the container control's) DataSource. The following example shows a sample declaration that displays the field containing the first name in a Label control.
First Name:
<asp:Label runat="server"
   Text="<%# Container.DataItem.FirstName %>" />
SeparatorTemplate Elements to render between each row, typically line breaks (<br> tags), horizontal lines (<hr> tags), and so on.
Note   The SeparatorTemplate item cannot be data bound.

The Repeater control has no built-in selection or editing support. You can create a handler for the control's ItemCommand event to process control events that are sent from the templates to the control.

The control binds its Item and AlternatingItem templates to a data structure referenced in the control's DataSource property. (The Header, Footer, and Separator templates cannot be bound to data.) If the Repeater control's DataSource property is set but no data is returned, the control renders the Header and Footer templates, but no items. If the DataSource property is not set, the Repeater control is not rendered.

CAUTION   Text is not HTML encoded before it is displayed in the Repeater control. This makes it possible to embed script within HTML tags in the text. If the values for the control come from user input, be sure to validate the values to help prevent security vulnerabilities.

For detailed information on the Repeater Web server control's properties and events, see the Repeater Class documentation.

Example

The following example demonstrates how to use the Repeater control to display the items of a data source.

<%@ Page Language="VB" AutoEventWireup="True" %>
<html>
<head>
   <script runat="server">
      Sub Page_Load(Sender As Object, e As EventArgs)
         If Not IsPostBack Then
            Dim values As New ArrayList()
            
            values.Add(New PositionData("Microsoft", "Msft"))
            values.Add(New PositionData("Intel", "Intc"))
            values.Add(New PositionData("Dell", "Dell"))
            
            Repeater1.DataSource = values
            Repeater1.DataBind()
            
            Repeater2.DataSource = values
            Repeater2.DataBind()
         End If
      End Sub

      Public Class PositionData
         Private myName As String
         Private myTicker As String        
        
         Public Sub New(newName As String, newTicker As String)
            Me.myName = newName
            Me.myTicker = newTicker
         End Sub        
        
         Public ReadOnly Property Name() As String
            Get
               Return myName
            End Get
         End Property        
        
         Public ReadOnly Property Ticker() As String
            Get
               Return myTicker
            End Get
         End Property
      End Class
   </script>
</head>
<body>
   <form runat="server">
      <h3>Repeater Example</h3>
      <b>Repeater1:</b>
      <p>
      <asp:Repeater id=Repeater1 runat="server">
         <HeaderTemplate>
            <table border=1>
               <tr>
                  <td><b>Company</b></td>
                  <td><b>Symbol</b></td>
               </tr>
         </HeaderTemplate>
             
         <ItemTemplate>
            <tr>
               <td> 
                  <%# DataBinder.Eval(Container.DataItem, "Name") %> 
               </td>
               <td> 
                  <%# DataBinder.Eval(Container.DataItem, "Ticker") %>
               </td>
            </tr>
         </ItemTemplate>
             
         <FooterTemplate>
            </table>

         </FooterTemplate>
             
      </asp:Repeater>
      <p>
      <b>Repeater2:</b>
      <p>
      <asp:Repeater id=Repeater2 runat="server">
         <HeaderTemplate>
            Company data:
         </HeaderTemplate>
             
         <ItemTemplate>
            <%# DataBinder.Eval(Container.DataItem, "Name") %> 
            (<%# DataBinder.Eval(Container.DataItem, "Ticker") %>)
         </ItemTemplate>
             
         <SeparatorTemplate>
            , 
         </SeparatorTemplate>
      </asp:Repeater>
   </form>
</body>
</html>
[C#]
<%@ Page Language="C#" AutoEventWireup="True" %>
<html>
<head>
   <script runat="server">
      void Page_Load(Object Sender, EventArgs e) 
      {
         if (!IsPostBack) 
         {
            ArrayList values = new ArrayList();
            values.Add(new PositionData("Microsoft", "Msft"));
            values.Add(new PositionData("Intel", "Intc"));
            values.Add(new PositionData("Dell", "Dell"));
            Repeater1.DataSource = values;
            Repeater1.DataBind();
                
            Repeater2.DataSource = values;
            Repeater2.DataBind();
         }
      }

      public class PositionData 
      {
         private string name;
         private string ticker;

         public PositionData(string name, string ticker) 
         {
            this.name = name;
            this.ticker = ticker;
         }

         public string Name 
         {
            get 
            {
               return name;
            }
         }

         public string Ticker 
         {
            get 
            {
               return ticker;
            }
         }
      } 
   </script>
</head>
<body>
   <form runat="server">
      <h3>Repeater Example</h3>
      <b>Repeater1:</b>
      <p>
      <asp:Repeater id=Repeater1 runat="server">
         <HeaderTemplate>
            <table border=1>
               <tr>
                  <td><b>Company</b></td> 
                  <td><b>Symbol</b></td>
               </tr>
         </HeaderTemplate>
         <ItemTemplate>
            <tr>
               <td> 
                  <%# DataBinder.Eval(Container.DataItem, "Name") %> 
               </td>
               <td> 
                  <%# DataBinder.Eval(Container.DataItem, "Ticker") %>
               </td>
            </tr>
         </ItemTemplate>
         <FooterTemplate>
            </table>

         </FooterTemplate>
      </asp:Repeater>
      <p>
      <b>Repeater2:</b>
      <p>
      <asp:Repeater id=Repeater2 runat="server">
         <HeaderTemplate>
            Company data:
         </HeaderTemplate> 
         <ItemTemplate>
            <%# DataBinder.Eval(Container.DataItem, "Name") %> 
            (<%# DataBinder.Eval(Container.DataItem, "Ticker") %>)
         </ItemTemplate>
         <SeparatorTemplate>
            , 
         </SeparatorTemplate>
      </asp:Repeater>
   </form>
</body>
</html>

See Also

Web Server Controls | Repeater Class