TreeView, contrôle

Le contrôle TreeView est utilisé pour afficher des données hiérarchiques, telles qu'une table des matières ou un répertoire de fichiers, dans une arborescence.

Pour ajouter un contrôle TreeView à une page

• Faites glisser le contrôle TreeView du panneau Boîte à outils sur votre page.

Pour appliquer des modes de mise en forme de base au contrôle TreeView

1. En mode Création, cliquez avec le bouton droit sur le contrôle TreeView , puis cliquez sur Afficher les tâches de contrôle courantes.

   Remarque :
   Vous pouvez également cliquer sur le contrôle TreeView en mode Création, puis cliquer sur la flèche dans le coin supérieur droit pour afficher le menu Tâches courantes du contrôle TreeView. Cliquez de nouveau sur la flèche pour masquer le menu.

2. Dans le menu Tâches courantes du contrôle TreeView, cliquez sur Format automatique.

3. Dans la boîte de dialogue Format automatique, sélectionnez un mode dans la liste Sélectionner un mode. L’effet du mode sur votre contrôle TreeView est affiché dans la zone Aperçu.

4. Cliquez sur OK pour appliquer le mode de mise en forme et fermer la boîte de dialogue ou sur Appliquer pour appliquer le mode de mise en forme sans fermer la boîte de dialogue.

Comme avec tous les contrôles ASP.NET, vous pouvez spécifier l'apparence et le comportement en définissant les propriétés dans le panneau Propriétés de la balise. Pour une description complète de toutes les propriétés du contrôle TreeView, voir Membres TreeView  dans MSDN Library.

Types de nœuds du contrôle TreeView

Le contrôle TreeView se compose d’un ou de plusieurs nœuds. Chaque entrée de l’arbre est appelée un nœud. Le tableau suivant décrit les trois types de nœuds différents.

Types de nœud du contrôle TreeView

Type de nœud	Description
Racine	Nœud qui n’a pas de nœud parent, mais qui possède un ou plusieurs nœuds enfants.
Parent	Nœud qui a un nœud parent et un ou plusieurs nœuds enfants.
Feuille	Nœud qui n’a pas de nœuds enfants.

Bien qu’une arborescence typique ne possède qu’un seul nœud racine, le contrôle TreeView vous permet d’y ajouter plusieurs nœuds racine. C’est utile lorsque vous souhaitez afficher des listes d’éléments sans afficher un nœud racine principal unique, comme dans une liste de catégories de produits.

Chaque nœud a une propriété Texte et une propriété Valeur. La valeur de la propriété Texte est affichée dans le contrôle TreeView , tandis que la propriété Value sert à stocker des données supplémentaires relatives au nœud, telles que les données passées à l’événement de publication qui est associé au nœud.

Pour définir des éléments pour le contrôle TreeView

1. En mode Création, cliquez avec le bouton droit sur le contrôle TreeView , puis cliquez sur Afficher les tâches de contrôle courantes.

2. Dans le menu Tâches du contrôle TreeView, cliquez sur Modifier les nœuds.

3. Dans la boîte de dialogue Éditeur de nœuds TreeView, cliquez sur Ajouter un élément racine pour ajouter un élément.

4. Dans la zone Propriétés, définissez les propriétés Text et href , et toutes les autres propriétés que vous voulez définir pour le nœud.

5. Ajoutez des éléments racines supplémentaires ou ajoutez des éléments enfants à l’élément sélectionné en cliquant sur Ajouter un élément enfant.

6. Après avoir ajouté plusieurs éléments de menu, vous pouvez ajuster leur position et retrait en sélectionnant un élément et en cliquant sur Déplacer un élément vers le haut dans la liste de ses frères, Déplacer un élément vers le bas dans la liste de ses frères, Définir l’élément sélectionné en tant qu’enfant de son parent, Définir l’élément sélectionné en tant qu’enfant de son frère précédent ou Supprimer un élément.

Vous pouvez lier un contrôle TreeView au XmlDataSource, contrôle et au SiteMapDataSource, contrôle. En outre, lors de la liaison de données, vous contrôlez entièrement les champs qui sont remplis à partir de la source de données. Pour plus d’informations, voir Liaison de données au contrôle serveur Web TreeView  dans MSDN Library.

Pour lier le contrôle TreeView à une source de données

1. En mode Création, cliquez avec le bouton droit sur le contrôle TreeView , puis cliquez sur Afficher les tâches de contrôle courantes.

2. Dans le menu Tâches courantes du contrôle DropDownList, cliquez sur une source de données existante ou sur <Nouvelle source de données> dans la liste déroulante Choisir une source de données.

3. Si vous choisissez <Nouvelle source de données>, la rubrique Configurer une source de données à l’aide d’un contrôle lié aux données s’ouvre. Cliquez sur Plan de site ou Fichier XML dans la zone À partir d'où l'application obtiendra-t-elle les données ? et donnez un ID à la source de données dans la zone Spécifiez un ID pour la source de données.

4. Si vous choisissez Fichier XML, dans la boîte de dialogue Configurer la source de données, spécifiez le fichier XML dans la zone Fichier de données et, éventuellement, un fichier de transformation XSL ou une expression XPath pour la source de données XML.

5. Cliquez sur OK dans la boîte de dialogue et dans l'assistant pour revenir au contrôle en mode Création.

6. Cliquez avec le bouton droit sur le contrôle, puis cliquez sur Modifier les liaisons de données TreeViewItem dans le menu contextuel.

7. Dans la liste Liaisons de données disponibles, sélectionnez un champ XML auquel vous voulez lier le menu, puis cliquez sur Ajouter.

8. Sélectionnez le champ dans la liste Liaisons de données sélectionnées et définissez les valeurs des propriétés dans la zone Propriétés de liaison de données. Par exemple, pour spécifier le texte à afficher dans le menu, choisissez #InnerText dans la liste déroulante des propriétés TextField pour afficher le texte entre les balises de début et de fin de l'élément XML.

Voir aussi

Concepts

contrôles de navigation ASP.NET
Menu, contrôle
SiteMapPath, contrôle