Microsoft Expression Web - Gridview
Le contrôle GridView est utilisé pour afficher les valeurs d'une source de données dans une table. Chaque colonne représente un champ, tandis que chaque ligne représente un enregistrement. Dans ce chapitre, nous allons apprendre un processus très simple pour afficher les données d'une base de données sur une page Web dans un GridView.
Step 1 - Créons une nouvelle page ASPX dans le projet SQLDataSource et appelons-la gridview.aspx
Step 2- Dans la boîte à outils, vous verrez les contrôles ASP.NET. Faites glisser le contrôle GridView et déposez-le sur la section du formulaire.
Vous pouvez voir que le menu contextuel GridView est ouvert. Sélectionnez maintenant le<New data source…>dans la liste déroulante Choisir la source de données. Il affichera l'assistant de configuration de la source de données.
Step 3- Sélectionnez la base de données car nous obtiendrons les données de la base de données SQL et spécifierons l'ID de la source de données. Cliquez sur OK.
Step 4- Sélectionnez la chaîne de connexion existante, que nous avons créée dans le chapitre SQL DataSource, car nous utiliserons la même base de données dans ce chapitre. Cliquez sur Suivant.
Step 5 - Dans un but de compréhension, sélectionnons la table des étudiants et cliquons sur le * checkboxqui récupérera toutes les colonnes de la table des étudiants. Cliquez sur Suivant.
Step 6 - Dans l'assistant suivant, vous pouvez tester la requête, alors cliquons sur le Test Query bouton.
En cliquant Next, il affichera l'écran suivant -
La conception de gridview.aspx ressemble à ceci -
Step 7- Laissez-nous prévisualiser la page Web dans un navigateur. Il apparaîtra comme suit -
Il s'agit d'un tableau simple sans aucun formatage.
Step 8 - Vous pouvez formater le GridView à partir du GridView Context menu.
Clique le Auto Format…lien. Dans la boîte de dialogue Format automatique, il existe de nombreux schémas prédéfinis. Sélectionnez un schéma selon vos besoins et cliquez sur OK.
Prévisualisons à nouveau la page Web dans un navigateur. Cela ressemblera à la capture d'écran suivante.
