Mis à jour le mardi 23 mai 2017
  • 20 heures
  • Facile

Ce cours est visible gratuitement en ligne.

Ce cours existe en livre papier.

Vous pouvez être accompagné et mentoré par un professeur particulier par visioconférence sur ce cours.

J'ai tout compris !

L'utilisation graphique : le DataGrid

Connectez-vous ou inscrivez-vous gratuitement pour bénéficier de toutes les fonctionnalités de ce cours !

Vous savez maintenant bien manipuler votre table et récupérer ses données sans trop de problèmes. Le DataSet nous a bien servi et vous savez désormais parfaitement l'utiliser et le manipuler (du moins je l'espère). Cet objet a la particularité de nous faciliter la tâche d'affichage des données qu'il contient. On va toutefois apprendre à connaître un nouvel objet : le DataGrid.

La découverte du DataGrid

Attaquons tout de suite avec le DataGrid (encore un DataQuelquechose… Ils nous envahissent !).

Le DataGrid est un élément graphique qui va nous permettre d'afficher des données récupérées sur une base de données. Son utilisation est très simple et le rendu final est agréable, comme le montre la figure suivante.

Voici à quoi ressemble l'affichage d'un DataGrid
Voici à quoi ressemble l'affichage d'un DataGrid

Comme vous le voyez, le DataGrid offre de multiples fonctionnalités et outils. Comme pour le reste de ce tutoriel, les connaissances que je vais vous apporter ne sont pas exhaustives, à vous de fouiller dans les propriétés et les Handles du DataGrid afin de savoir l'exploiter au mieux.

Ce qu'il faut savoir, c'est que notre DataGrid va avoir la même structure qu'une DataTable ou un DataView, c'est-à-dire qu'il possède des attributs de type Column, Row et Item. Si vous avez compris le fonctionnement de ces objets, vous allez pouvoir interagir de la même manière avec votre DataGrid.

Cependant, pour une plus grande flexibilité, je vais vous apprendre dans ce chapitre à lier votre DataGrid à un objet contenant des données. Cette liaison permettra à notre DataGrid à copier chacune des données pour l'afficher. Ainsi, une fois la liaison effectuée avec notre objet de type DataTable par exemple, on pourra restreindre les modifications à effectuer sur ladite DataTable, puis effectuer une mise à jour de l'objet graphique.

Cette méthode de programmation est spécifique à celle que vous avez pu utiliser précédemment (quand on assignait directement des valeurs à nos contrôles graphiques). Mais elle est presque nécessaire lors du travail sur les bases de données.

Bref, commençons par apprendre à lier des données avec notre DataGrid. Pour cela, il existe deux grandes voies :

  • En se servant du code VB .NET pour lier une DataTable ou un DataView au DataGrid ;

  • En utilisant l'assistant de liaison d'un DataGrid à une BDD.

Liaison avec le code VB .NET

Nous allons voir les deux en commençant par notre moyen actuel, c'est-à-dire en se servant du code .NET.

Créez donc un nouveau projet, graphique cette fois-ci. Ajoutez la composant DataGrid à votre feuille graphique. Il se trouve dans la rubrique Données. Puis utilisons le code VB que nous avons déjà utilisé pour forger notre DataSet et plaçons-le dans le FormLoad.

Dim Connexion As New SqlConnection("Data Source=localhost;Initial Catalog=SDZ;User Id=sa;Password=********;")

Try
     Connexion.Open()

     Dim Requete As String = "SELECT * from Musiques"
     Dim Commande As New SqlCommand(Requete, Connexion)
     Dim Adaptateur As New SqlDataAdapter(Commande)
     Dim MonDataSet As New DataSet
     Try
         Adaptateur.Fill(MonDataSet, "Musiques")

         'Liaison avec le DataGrid

     Catch ex As Exception
         Console.WriteLine(ex.Message)
     End Try

Catch ex As Exception
     Console.WriteLine(ex.Message)
End Try

Nous revoilà donc avec notre DataSet contenant les données de la BDD. Pour le lier avec notre DataGrid, nous allons devoir utiliser la propriété DataSource de ce dernier.

On peut assigner à DataSource une DataTable ou un DataView, en fonction de ce que l'on souhaite.

DG_DataGrid.DataSource = MonDataSet.Tables("Musiques")

J'ai donc lié le DataGrid à ma DataTable, vous pouvez tester le programme et constater qu'il a parfaitement rempli le composant.

Vous pouvez voir qu'en fait ce DataGrid est une « vue » au même titre qu'un DataView, vous pouvez effectuer des tris en cliquant sur les colonnes. Il est également possible de modifier les données (les changements ne seront pas effectifs sur la BDD cependant) ou d'en ajouter.

Liaison via l'assistant

La seconde méthode est d'utiliser l'assistant. Créez un nouveau projet et ajoutez un DataGrid. Cliquez sur la petite flèche en haut à droite du composant, comme à la figure suivante.

Cliquez sur la petite flèche en haut à droite du composant
Cliquez sur la petite flèche en haut à droite du composant

Comme vous le voyez, vous pouvez spécifier à partir de cette fenêtre si le DataGrid aura la possibilité d'ajouter des données, de les modifier, etc. Décochez tout.

Puis cliquez sur Choisir la source de données et Ajouter la source de données du projet, comme à la figure suivante.

Cliquez sur le lien
Cliquez sur le lien

Vous voici devant l'assistant d'ajout d'une base de données au projet. Cela va permettre de lier une base au projet afin de faciliter la liaison d'éléments avec la BDD sans passer par du code VB .NET.

Suivons donc cet assistant. Dans la première fenêtre, spécifiez Base de données, puis dans la seconde, DataSet.

Maintenant, créons notre connexion vers la BDD. Cliquez sur Nouvelle connexion puis changez la source de données pour utiliser SQL Server (voir figure suivante).

Changez la source de données
Changez la source de données

Sélectionnez Avancées et entrez les mêmes valeurs qu'à la figure suivante.

Entrez ces valeurs
Entrez ces valeurs

Il faut modifier :

  • User ID ;

  • Password ;

  • User Instance ;

  • Attach DB Filename et y entrer l'adresse du fichier de BDD : C:\Program Files\Microsoft SQL Server\MSSQL10_50.MSSQLSERVER\MSSQL\DATA\SDZ.mdf ;

  • Initial Catalog ;

  • DataSource.

Validez, utilisez la connexion SQL Server et testez la connexion.

Puis cliquez sur OK. Vous revoilà à l'ancienne fenêtre, sélectionnez le bouton radio Oui je veux inclure…, cela ajoutera le mot de passe à la chaîne de connexion.

Elle devrait alors ressembler à ça :

Data Source=.;AttachDbFilename="C:\Program Files\Microsoft SQL Server\MSSQL10_50.MSSQLSERVER\MSSQL\DATA\SDZ.mdf";Initial Catalog=SDZ;User ID=sa;Password=*******;Connect Timeout=30;User Instance=False

Puis Suivant.

Si le programme vous demande de copier le fichier, répondez Non.

Finalement, ne stockez pas la chaîne dans le fichier de configuration. Lors de plus gros projets, cette méthode est utile, notamment pour le changement fréquent d'identifiants.

Vous voilà désormais dans la création du DataSet.

Spécifiez que vous souhaitez toute la table SDZ et nommez-la (voir figure suivante).

Cochez toutes les cases de la table
Cochez toutes les cases de la table

En cliquant sur Terminer, la fenêtre visible à la figure suivante s'affiche.

DataGrid
DataGrid

Vous avez sans doute remarqué les trois objets qui ont été créés suite à cette opération :

  • Un DataSet ;

  • Un BindingSource qui lie notre source à notre DataSet, car on ne peut pas lier directement un DataSet donc cet objet effectue la liaison ;

  • Un TableAdaptater, il effectue la requête pour récupérer les données dans le DataSet. Son fonctionnement est plutôt particulier et compliqué ; pour plus de souplesse je vous recommande d'utiliser du code VB plutôt que ces objets en cas de projets nécessitant des requêtes spécifiques.

Vous voilà en possession du même DataSet que précédemment. Si vous lancez le programme, le résultat sera le même.

Le résultat est le même que précédemment
Le résultat est le même que précédemment
  • Le DataGrid permet d'afficher graphiquement des données en provenance d'une table.

  • On peut ensuite le programmer pour appliquer les modifications que l'utilisateur effectue.

  • L'assistant de VB .NET vous aidera dans l'étape de configuration pour le lier à la BDD.

Exemple de certificat de réussite
Exemple de certificat de réussite