Vue d'ensemble du contrôle serveur Web Repeater

  • Article

Mise à jour : novembre 2007

Le contrôle serveur Web Repeater est un contrôle conteneur lié aux données qui génère une liste d'éléments individuels. Vous définissez la disposition des éléments individuels dans une page Web à l'aide de modèles. Lors de l'exécution de la page, le contrôle répète la disposition de chaque élément de la source de données.

Cette rubrique contient les sections suivantes :

  • Contexte

  • Exemples de code

  • Référence de classe

Contexte

Le contrôle serveur Web Repeater est un contrôle conteneur qui vous permet de créer des listes personnalisées à partir des données disponibles pour la page. Le contrôle Repeater n'a pas de rendu intégré propre, ce qui signifie que vous devez fournir la disposition du contrôle Repeater en créant des modèles. Lors de l'exécution de la page, le contrôle Repeater parcourt les enregistrements figurant dans la source de données et assure le rendu d'un élément pour chaque enregistrement.

Le contrôle Repeater n'ayant aucune apparence par défaut, vous pouvez l'utiliser pour créer de nombreux types de listes, notamment les suivants :

  • Disposition en tableau

  • Liste délimitée par des virgules (par exemple, a, b, c, d, etc.)

  • Liste XML mise en forme

Utilisation de modèles avec le contrôle Repeater

Pour utiliser le contrôle Repeater, vous devez créer des modèles qui définissent la disposition du contenu du contrôle. Les modèles peuvent contenir n'importe quelle combinaison de balisage et de contrôles. Si aucun modèle n'est défini ou si aucun des modèles ne comprend d'éléments, le contrôle n'apparaît pas dans la page lorsque l'application est exécutée.

Le tableau suivant décrit les modèles pris en charge par le contrôle Repeater.

Propriété du modèle

Description

ItemTemplate

Contient les éléments et les contrôles HTML à rendre une fois pour chaque élément de données de la source de données.

AlternatingItemTemplate

Contient les éléments et les contrôles HTML à rendre une fois pour un élément de données sur deux dans la source de données. En général, ce modèle sert à donner une apparence différente aux éléments de remplacement, par exemple une couleur d'arrière-plan autre que celle qui est spécifiée dans la propriété ItemTemplate.

HeaderTemplate et FooterTemplate

Contient le texte et les contrôles à rendre en début et en fin de liste, respectivement.

SeparatorTemplate

Contient les éléments à rendre entre chaque élément. Une ligne (utilisant un élément hr) en est un exemple.

Pour plus d'informations, consultez Modèles de contrôles serveur Web ASP.NET.

Liaison de données au contrôle Repeater

Le contrôle Repeater doit être lié à une source de données. La source de données la plus courante est un contrôle de source de données, par exemple un contrôle SqlDataSource ou ObjectDataSource. Vous pouvez aussi lier un contrôle Repeater à toute classe qui implémente l'interface IEnumerable, ce qui englobe les groupes de données ADO.NET (la classe DataSet), les lecteurs de données (les classes SqlDataReader ou OleDbDataReader) ou la plupart des collections.

Lors de la liaison de données, vous spécifiez une source de données pour le contrôle Repeater dans son ensemble. Lorsque vous ajoutez des contrôles au contrôle Repeater (par exemple, lorsque vous ajoutez des contrôles Label ou TextBox à un modèle), vous devez utiliser la syntaxe de liaison de données pour lier le contrôle au champ des éléments retournés par la source de données. L'exemple suivant montre un ItemTemplate qui contient un contrôle Label lié aux données.

<%@ Page Language="VB" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 
  "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head id="Head1" >
  <title>ASP.NET Repeater Example</title>
</head>
<body>
  <form id="form1" >
    <div>
      <asp:Repeater ID="Repeater1"  DataSourceID="SqlDataSource1">
        <HeaderTemplate>
          <table>
            <tr>
              <th>
                Name</th>
              <th>
                Description</th>
            </tr>
        </HeaderTemplate>
        <ItemTemplate>
          <tr>
            <td style="background-color:#CCFFCC">
              <asp:Label  ID="Label1" Text='<%# Eval("CategoryName") %>' />
            </td>
            <td style="background-color:#CCFFCC">
              <asp:Label  ID="Label2" Text='<%# Eval("Description") %>' />
            </td>
          </tr>
        </ItemTemplate>
        <AlternatingItemTemplate>
          <tr>
            <td>
              <asp:Label  ID="Label3" Text='<%# Eval("CategoryName") %>' />
            </td>
            <td>
              <asp:Label  ID="Label4" Text='<%# Eval("Description") %>' />
            </td>
          </tr>
        </AlternatingItemTemplate>
        <FooterTemplate>
          </table>
        </FooterTemplate>
      </asp:Repeater>
      <asp:SqlDataSource ConnectionString="<%$ ConnectionStrings:NorthwindConnectionString %>"
        ID="SqlDataSource1"  SelectCommand="SELECT [CategoryID], [CategoryName], 
            [Description] FROM [Categories]"></asp:SqlDataSource>
    </div>
  </form>
</body>
</html>

<%@ Page Language="C#" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head id="Head1" >
  <title>ASP.NET Repeater Example</title>
</head>
<body>
  <form id="form1" >
    <div>
      <asp:Repeater ID="Repeater1"  DataSourceID="SqlDataSource1">
        <HeaderTemplate>
          <table>
            <tr>
              <th>
                Name</th>
              <th>
                Description</th>
            </tr>
        </HeaderTemplate>
        <ItemTemplate>
          <tr>
            <td style="background-color:#CCFFCC">
              <asp:Label  ID="Label1" Text='<%# Eval("CategoryName") %>' />
            </td>
            <td style="background-color:#CCFFCC">
              <asp:Label  ID="Label2" Text='<%# Eval("Description") %>' />
            </td>
          </tr>
        </ItemTemplate>
        <AlternatingItemTemplate>
          <tr>
            <td>
              <asp:Label  ID="Label3" Text='<%# Eval("CategoryName") %>' />
            </td>
            <td>
              <asp:Label  ID="Label4" Text='<%# Eval("Description") %>' />
            </td>
          </tr>
        </AlternatingItemTemplate>
        <FooterTemplate>
          </table>
        </FooterTemplate>
      </asp:Repeater>
      <asp:SqlDataSource ConnectionString="<%$ ConnectionStrings:NorthwindConnectionString %>"
        ID="SqlDataSource1"  SelectCommand="SELECT [CategoryID], [CategoryName], 
              [Description] FROM [Categories]"></asp:SqlDataSource>
    </div>
  </form>
</body>
</html>
Remarque :

Vous ne pouvez pas lier de contrôles situés dans les modèles d'en-tête, de pied de page et de séparateur à l'aide de la fonction de liaison de données Eval. Si vous avez des contrôles dans ces modèles, vous ne pouvez définir leurs propriétés que statiquement.

Pour avoir une vue d'ensemble de la liaison de données dans des contrôles serveur Web, consultez Procédure pas à pas : accès aux données de base dans les pages Web et Comment : ajouter des contrôles serveur Web Repeater à une page Web Forms.

Événements pris en charge par le contrôle Repeater

Le contrôle Repeater prend en charge plusieurs événements. L'un d'eux, l'événement ItemCreated, vous offre la possibilité de personnaliser le processus de création d'éléments au moment de l'exécution. L'événement ItemDataBound vous permet également de personnaliser le contrôle Repeater, mais une fois que les données sont accessibles pour consultation. Par exemple, si vous utilisez le contrôle Repeater pour afficher une liste de tâches, vous pouvez afficher les tâches en retard en rouge, les tâches terminées en noir et les autres tâches en vert. Vous pouvez utiliser l'un ou l'autre de ces événements pour substituer la mise en forme définie dans le modèle.

L'événement ItemCommand est déclenché en réaction à des clics sur des boutons dans des éléments. Cet événement est conçu pour vous permettre d'incorporer un contrôle serveur Web Button, LinkButton ou ImageButton dans un modèle d'élément, puis d'être averti lorsque survient un clic sur le bouton. Lorsqu'un utilisateur clique sur le bouton, l'événement est envoyé au conteneur du bouton, en l'occurrence le contrôle Repeater. L'événement ItemCommand est généralement utilisé pour programmer des comportements de mise à jour et de suppression pour le contrôle Repeater Puisque chaque clic de bouton déclenche le même événement ItemCommand, vous pouvez savoir quel bouton a reçu un clic en donnant à la propriété CommandName de chaque bouton une valeur de chaîne unique. La propriété CommandSource du paramètre RepeaterCommandEventArgs contient la propriété CommandName du bouton ayant reçu un clic.

Pour plus d'informations, consultez Comment : répondre à des événements de bouton dans des éléments DataList ou Repeater.

Retour au début

Exemples de code

Comment : ajouter des contrôles serveur Web Repeater à une page Web Forms

Retour au début

Référence de classe

Le tableau suivant répertorie les classes clés relatives au contrôle Repeater.

Membre

Description

Repeater

Classe principale du contrôle.

Retour au début

Voir aussi

Référence

Vue d'ensemble du contrôle serveur Web DataList