Partager via

Pagination dans un contrôle serveur Web DetailsView

  • Article

Mise à jour : novembre 2007

Le contrôle DetailsView ASP.NET propose une prise en charge intégrée permettant aux utilisateurs de paginer (parcourir) un à un les enregistrements. Il prend également en charge la personnalisation de l'interface utilisateur de pagination. Dans le contrôle DetailsView, une page de données est une ligne liée unique.

Fonctionnement de la pagination dans le contrôle DetailsView

Le contrôle DetailsView prend en charge la pagination sur les enregistrements dans sa source de données. Pour activer le comportement de pagination, vous affectez la valeur true à la propriété AllowPaging. La taille de page demandée par le contrôle DetailsView est toujours d'une ligne.

Si le contrôle DetailsView est lié à un contrôle de source de données ou à une structure de données qui implémente l'interface ICollection (y compris les groupes de données), le contrôle obtient tous les enregistrements de la source de données, affiche l'enregistrement pour la page en cours et ignore le reste. Lorsque l'utilisateur passe à une autre page, le contrôle DetailsView répète le processus, en affichant un autre enregistrement.

Remarque :

Si la source de données n'implémente pas l'interface ICollection, le contrôle DetailsView ne peut pas effectuer de pagination. Par exemple, si vous utilisez un contrôle SqlDataSource et que vous avez affecté la valeur DataReader à sa propriété DataSourceMode, le contrôle DetailsView ne peut pas implémenter la pagination.

Certaines sources de données, telles que le contrôle ObjectDataSource, proposent des fonctionnalités de pagination plus avancées. Dans ces cas, le contrôle DetailsView tire parti des fonctions plus avancées de la source de données pour améliorer ses performances et sa souplesse durant la pagination. Le nombre de lignes demandé peut varier selon si la source de données prend en charge l'obtention du nombre total de lignes.

Remarque :

Si vous créez une source de données (par exemple, l'implémentation d'une méthode SelectCountMethod dans l'objet source pour le contrôle ObjectDataSource), il est vivement recommandé que votre source de données retourne le nombre total de lignes lorsqu'elle fournit des pages de données. Cela réduit le nombre d'enregistrements que le contrôle DetailsView doit demander pour récupérer une page de données. Si le nombre total de lignes est fourni par l'objet de données source, le contrôle DetailsView demandera uniquement une seule ligne à la fois pour chaque page. Si le nombre total de lignes n'est pas indiqué, le contrôle DetailsView doit demander toutes les lignes de la source de données (en commençant par la ligne qui représente la page de données demandée) et ignorer toutes les lignes à l'exception de la ligne affichée.

Personnalisation des paramètres de pagination et de l'interface utilisateur

Vous pouvez personnaliser l'interface utilisateur de la pagination DetailsView de plusieurs manières.

Modes de pagination

La propriété PagerSettings vous permet de personnaliser l'apparence de l'interface utilisateur de pagination générée par le contrôle DetailsView lorsque vous affectez la valeur true à la propriété AllowPaging. Le contrôle DetailsView peut afficher des contrôles de direction qui permettent la navigation avant et arrière, ainsi que des contrôles numériques qui permettent à un utilisateur d'accéder à une page spécifique.

Une classe PagerSettings est affectée à la propriété PagerSettings du contrôle DetailsView. Vous pouvez personnaliser le mode de pagination en affectant la valeur PagerButtons à la propriété Mode du contrôle DetailsView. Par exemple, vous pouvez personnaliser le mode de l'interface utilisateur de pagination en le définissant comme suit :

DetailsView1.PagerSettings.Mode = PagerButtons.NextPreviousFirstLast

Vous avez le choix entre les modes suivants :

Apparence du contrôle Pager

Le contrôle DetailsView est doté de nombreuses propriétés que vous pouvez utiliser pour personnaliser le texte et les images pour les différents modes du pagineur. Par exemple, si vous affectez la valeur NextPrevious au mode de pagination d'un contrôle DetailsView et que vous souhaitez personnaliser le texte affiché, vous pouvez affecter vos propres valeurs aux propriétés NextPageText et PreviousPageText. Par défaut, les propriétés PreviousPageText et NextPageText ont la valeur « < » et « > », respectivement.

Vous pouvez aussi utiliser des images pour personnaliser l'apparence de vos contrôles de pagination. La classe PagerSettings inclut les propriétés de l'URL de l'image pour les boutons de commande de page (première, dernière, précédente et suivante).

Enfin, vous pouvez contrôler l'apparence des commandes de pagination en affectant une valeur TableItemStyle à la propriété PagerStyle du contrôle DetailsView.

Modèle Pagination des données

Si vous affectez à la propriété AllowPaging du contrôle DetailsView la valeur true, le contrôle DetailsView ajoute automatiquement les contrôles d'interface utilisateur pour la pagination. Vous pouvez personnaliser l'interface utilisateur de pagination en ajoutant un modèle PagerTemplate. Pour spécifier l'opération de pagination à effectuer, ajoutez un contrôle Button au modèle, puis affectez la valeur Page à sa propriété CommandName et l'une des valeurs suivantes à sa propriété CommandArgument :

  • First   Pour accéder à la première page.

  • Last   Pour accéder à la dernière page.

  • Prev   Pour accéder à la page précédente.

  • Next   Pour accéder à la page de données suivante.

  • Un nombre   Pour indiquer une page spécifique.

L'exemple de code suivant montre un contrôle DetailsView configuré pour fournir la pagination.

<%@ 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 >
    <title>DetailsView Example</title>
</head>
<body>
    <form id="form1" >
      <h3>DetailsView Example</h3>
        <table cellspacing="10"> 
          <tr>               
            <td valign="top">

              <asp:DetailsView ID="EmployeesDetailsView"
                DataSourceID="EmployeesSqlDataSource"
                AutoGenerateRows="false"
                AllowPaging="true"
                DataKeyNames="EmployeeID"     
                >

                <HeaderStyle forecolor="white" backcolor="Blue" />                

                <Fields>
                  <asp:BoundField Datafield="EmployeeID" HeaderText="Employee ID" ReadOnly="true"/>                    
                  <asp:BoundField Datafield="FirstName"  HeaderText="First Name"/>
                  <asp:BoundField Datafield="LastName"   HeaderText="Last Name"/>                    
                </Fields>

                <PagerSettings Mode="NextPreviousFirstLast"
                               FirstPageText="<<"
                               LastPageText=">>"
                               PageButtonCount="1"  
                               Position="Top"/> 
              </asp:DetailsView>

            </td>
          </tr>
        </table>

        <asp:SqlDataSource ID="EmployeesSqlDataSource" 
          SelectCommand="SELECT * FROM [Employees]" 
          connectionstring="<%$ ConnectionStrings:NorthwindConnection %>" 
          RunAt="server"/>

      </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 >
    <title>DetailsView Example</title>
</head>
<body>
    <form id="form1" >
      <h3>DetailsView Example</h3>
        <table cellspacing="10"> 
          <tr>               
            <td valign="top">

              <asp:DetailsView ID="EmployeesDetailsView"
                DataSourceID="EmployeesSqlDataSource"
                AutoGenerateRows="false"
                AllowPaging="true"
                DataKeyNames="EmployeeID"     
                >

                <HeaderStyle forecolor="white" backcolor="Blue" />                

                <Fields>
                  <asp:BoundField Datafield="EmployeeID" HeaderText="Employee ID" ReadOnly="true"/>                    
                  <asp:BoundField Datafield="FirstName"  HeaderText="First Name"/>
                  <asp:BoundField Datafield="LastName"   HeaderText="Last Name"/>                    
                </Fields>

                <PagerSettings Mode="NextPreviousFirstLast"
                               FirstPageText="<<"
                               LastPageText=">>"
                               PageButtonCount="1"  
                               Position="Top"/> 
              </asp:DetailsView>

            </td>
          </tr>
        </table>

        <asp:SqlDataSource ID="EmployeesSqlDataSource" 
          SelectCommand="SELECT * FROM [Employees]" 
          connectionstring="<%$ ConnectionStrings:NorthwindConnection %>" 
          RunAt="server"/>

      </form>
  </body>
</html>

Voir aussi

Référence

Vue d'ensemble du contrôle serveur Web DetailsView