Partager via


Comment : activer la sélection par défaut dans le contrôle serveur Web GridView

Mise à jour : novembre 2007

Le contrôle ASP.NET GridView a une fonction de sélection intégrée qui permet aux utilisateurs de sélectionner une ligne dans la grille. La sélection d'une ligne dans un contrôle GridView n'exécute pas n'importe quelle tâche de façon inhérente. En ajoutant la fonction de sélection, vous pouvez toutefois ajouter des fonctionnalités à la grille, qui reposent sur les utilisateurs sélectionnant une ligne spécifique. En général, vous ajoutez une fonctionnalité de sélection au contrôle GridView aux fins suivantes :

  • Lorsque les utilisateurs sélectionnent une ligne, la ligne est réaffichée avec une apparence différente.

  • Lorsque les utilisateurs sélectionnent une ligne, les données connexes sont affichées ailleurs dans la page, dans un contrôle DetailsView, par exemple.

Pour accéder à la ligne sélectionnée, utilisez la propriété SelectedRow.

Pour exécuter des actions personnalisées lorsqu'un utilisateur sélectionne une ligne, vous devez fournir un gestionnaire pour l'événement SelectedIndexChanging.

Procédures

Pour activer la sélection à l'aide de la balise active

  1. En mode Design, cliquez avec le bouton droit sur le contrôle GridView et cliquez sur Afficher la balise active.

  2. Dans le panneau des balises actives, sélectionnez Activer la sélection.

Pour activer la sélection par défaut à l'aide de la propriété AutoGenerateSelectButton

  • Sélectionnez le contrôle GridView puis, dans la fenêtre Propriétés, affectez à AutoGenerateSelectButton la valeur true.

    - ou -

  • En mode Source, dans l'élément <asp:GridView>, affectez à l'attribut AutoGenerateSelecttButton la valeur true :

    <asp:GridView Runat="server" ID="GridView1" 
      AutoGenerateSelectButton="true" />
    

Pour personnaliser l'apparence d'une ligne en mode de sélection

  • Définissez les propriétés de SelectedRowStyle.

    Par exemple, si vous attribuez à la sous-propriété BackColor de SelectedRowStyle la valeur « gris », une ligne sélectionnée est affichée avec un arrière-plan gris.

Pour personnaliser le texte de commande du bouton Sélectionner

  1. En mode Design, cliquez avec le bouton droit sur le contrôle GridView et cliquez sur Afficher la balise active.

  2. Cliquez sur Modifier les colonnes.

    La boîte de dialogue Champs s'affiche.

  3. Sous Champs sélectionnés, cliquez sur Sélectionner.

    Les propriétés de champ sont chargées dans la grille des propriétés.

  4. Sous les propriétés CommandField, entrez le texte du bouton Sélectionner dans la propriété SelectText.

Pour transformer le texte de commande du bouton Sélectionner en une image

  1. En mode Design, cliquez avec le bouton droit sur le contrôle GridView et cliquez sur Afficher la balise active.

  2. Cliquez sur Modifier les colonnes.

    La boîte de dialogue Champs s'affiche.

  3. Sous Champs sélectionnés, cliquez sur Sélectionner.

    Les propriétés de champ sont chargées dans la grille des propriétés.

  4. Sous les propriétés CommandField, entrez ou sélectionnez l'URL de l'image à utiliser pour le bouton Sélectionner dans le champ SelectImageUrl.

  5. Sous les propriétés CommandField, sélectionnez Image dans le champ ButtonType.

  6. Cliquez sur OK.

Pour afficher la ligne sélectionnée dans un contrôle DetailsView

  1. Copiez le contrôle de source de données lié au contrôle GridView et collez une copie de ce contrôle dans la page.

  2. En mode Design, cliquez avec le bouton droit sur le contrôle de source de données, puis cliquez sur Afficher la balise active.

  3. Cliquez sur Configurer la source de données….

  4. Vérifiez que la valeur du champ Quelle connexion de données votre application doit-elle utiliser pour établir une connexion à la base de données ? est la même connexion que celle utilisée par le contrôle GridView.

  5. Cliquez sur Suivant.

  6. Sélectionnez l'option Spécifiez les colonnes d'une table ou d'une vue.

  7. Dans la liste déroulante Nom, vérifiez que la même table liée au contrôle GridView est sélectionnée.

  8. Sous Colonnes, sélectionnez les colonnes de la table à afficher dans le contrôle DetailsView.

  9. Cliquez sur le bouton WHERE…

    La fenêtre Ajouter une clause WHERE s'affiche.

  10. Dans la liste déroulante Colonne, sélectionnez le nom de colonne à utiliser dans la clause WHERE. Cette colonne doit être une clé primaire de la table ou elle ne doit contenir que des valeurs uniques pour identifier la ligne sélectionnée.

  11. Dans la liste déroulante Source, sélectionnez Contrôle.

  12. Dans la liste déroulante ID du contrôle, sélectionnez l'ID du contrôle GridView.

  13. Cliquez sur Ajouter.

  14. Cliquez sur OK, Suivant et enfin Terminer.

  15. Cliquez avec le bouton droit sur le contrôle DetailsView, puis cliquez sur Afficher la balise active.

  16. Dans la liste déroulante Choisir la source de données, sélectionnez le contrôle de source de données que vous venez de configurer.

Voir aussi

Concepts

Modification des données dans un contrôle serveur Web GridView

Référence

Vue d'ensemble du contrôle serveur Web GridView