[ASP.NET] Server Controls – Repeater

Repeater” is the simplest composite data-bound control. It has no built-in layout or styles and does not provide selection or editing features. Also, by default it doesn’t provide paging and sorting of items.

Repeater has been used since .NET 1 so there are a lot of legacy code that uses Repeater controls. Since .NET 3.5, it is recommended to use “ListView” rather than “Repeater“.

1. Repeater Control

The “System.Web.UI.WebControls.Repeater” class represents a simple data-bound list control.

public class Repeater : Control, INamingContainer
{
  public Object DataSource { get; set; }
  public string DataSourceID { get; set; }
  public string DataMember { get; set; }

  public RepeaterItemCollection Items { get; }
}

2. Templates

Repeater is a template based control and provides the following templates:

  • ItemTemplate
  • AlternatingItemTemplate
  • SeparatorTemplate
  • HeaderTemplate
  • FooterTemplate

Note that Repeater does not support “EditItemTemplate“.

3. RepeaterItem

The Repeater control populates the “Items” collection by enumerating every object in its DataSource. And the Repeater renders each item. Each Item is represented by the “RepeaterItem” class.

public class RepeaterItem  : Control
{
  public Object DataItem { get; set; }
  public int ItemIndex { get; }
  public ListItemType ItemType { get; } // Header, Footer, Item, AlternatingItem, SelectedItem, EditItem, Separator, Pager
}

In the aspx page, you can access the “DataItem” object in the Repeater templates using the “Container.DataItem” alias. Please look at the example for the correct syntax.

4. Events

Repeater provides the following events:

public event RepeaterItemEventHandler ItemCreated; // Occurs when an item is created
public event RepeaterItemEventHandler ItemDataBound; // Occurs after an item is data-bound but before it is rendered
public event RepeaterCommandEventHandler ItemCommand // Occurs when a button is clicked

You can use these events in the aspx file like this:

<asp:Repeater
  OnItemCreated="handler"
  OnItemDataBound="handler"
  OnItemCommand="handler" />

5. Event Arguments

RepeaterItemEventArgs” provides data for the “ItemCreated” and “ItemDataBound” events of a Repeater.

public class RepeaterItemEventArgs : EventArgs
{
  public RepeaterItem Item { get; }
}

RepeaterCommandEventArgs” provides data for the “ItemCommand” event of a Repeater.

public class RepeaterCommandEventArgs : CommandEventArgs
{
  public string CommandName { get; }
  public Object CommandArgument { get; }

  public Object CommandSource { get; }
  public RepeaterItem Item { get; }
}

6. Example

Create a data class: “Product

public class Product
{
  public string Name { get; set; }
  public decimal Price { get; set; }
}

Add the “Repeater” control to the form.

<asp:repeater runat="server" ID="pRepeater" onitemcommand="Product_ItemCommand">
  <HeaderTemplate>
    <table border="1">
      <thead><tr>
        <th>Product</th>
        <th>Price</th>
        <th></th>
      </tr></thead>
      <tbody>
  </HeaderTemplate>
  <ItemTemplate>
    <tr>
      <td><%# DataBinder.Eval(Container.DataItem, "Name") %></td>
      <td><%# ((WebApp4.Controls.DataControls.Product)Container.DataItem).Price %></td>
      <td>
        <asp:LinkButton ID="copyBtn" runat="server"
          CommandName="copy"
          CommandArgument="<%# ((WebApp4.Controls.DataControls.Product)Container.DataItem).Name %>"
          text="Copy" />
        <asp:LinkButton ID="deleteBtn" runat="server"
          CommandName="delete"
          CommandArgument='<%# DataBinder.Eval(Container.DataItem, "Name") %>'
          text="Delete" />
      </td>
    </tr>
  </ItemTemplate>
  <FooterTemplate>
      </tbody>
    </table>
  </FooterTemplate>
</asp:repeater>

<asp:Label ID="lblStatus" runat="server"></asp:Label>

Let’s create a product list and bound it to the control

protected void Page_Load(object sender, EventArgs e)
{
  if (!IsPostBack)
  {
    List<Product> products = new List<Product>
    {
      new Product { Name = "Toy", Price = 10.99M },
      new Product { Name = "Game", Price = 23.00M },
      new Product { Name = "Bread", Price = 3.99M }
    };
    pRepeater.DataSource = products;
    pRepeater.DataBind();
  }
}

Finally handle the events.

protected void Product_ItemCommand(object source, RepeaterCommandEventArgs e)
{
  string message = "";
  switch (e.CommandName)
  {
    case "copy":
      message = String.Format("Copy button is clicked: {0}", e.CommandArgument);
      break;
    case "delete":
      message = String.Format("Delete button is clicked: {0}", e.CommandArgument);
      break;
    }
    lblStatus.Text = message;
}

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out /  Change )

Google photo

You are commenting using your Google account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )

Connecting to %s