Réalisation d'application Web simple en ASP.NET

Régis POUILLER

Cet article présente la création d'une application Web avec ASP.NET.
Il présente divers éléments techniques : Web form, tags ASP.Net (dont DataGrid), internationalisation, accès aux données (chaîne de connexion, DataReader, Command, Entity Framework, LINQ), validation des formulaires, page maître, manipulation des fichiers et les Ajax Controls (Ajax Control Toolkit).

Une discussion a été ouverte pour les commentaires sur la publication de cet article : [ Commentez ]

- Titre : Réalisation d'application Web simple en ASP.NET

- Auteur : Régis POUILLER

- Parution : 17 novembre 2014

- Licence : Copyright ® 2014 Régis POUILLER. Aucune reproduction, même partielle, ne peut être faite de ce site et de l'ensemble de son contenu : textes, documents, images, etc. sans l'autorisation expresse de l'auteur. Sinon vous encourez selon la loi jusqu'à trois ans de prison et jusqu'à 300 000 € de dommages et intérêts.

Sommaire

- I. INTRODUCTION

- I-A. Objectif

- I-B. Versions utilisées

- II. INSTALLATIONS

- II-A. Installation du framework .Net

- II-B. Installation de SQL Server Express

- II-C. Installation de Visual Studio Express

- III. « BONJOUR LE MONDE ! »

- III-A. Création de l'application

- III-B. Création de la page bonjour.aspx

- III-C. Lancement de la page

- III-D. Externalisation des libellés dans une ressource globale

- IV. AFFICHAGE DE DONNÉES EN BASE

- IV-A. Création de la base de données en local

- IV-B. Création de la page d'affichage

- IV-C. Modification pour utiliser un DataGrid

- IV-D. Création de la base de données en réseau

- IV-E. Modification pour utiliser la base en réseau

- V. CRÉATION DE DONNÉES EN BASE

- VI. SUPPRESSION DE DONNÉES EN BASE

- VII. MODIFICATION DE DONNÉES EN BASE

- VIII. UNIFICATION DE L'APPLICATION PAR UN MENU

- IX. MANIPULATION DES FICHIERS

- IX-A. Écriture d'un fichier texte

- IX-B. Lecture d'un fichier texte

- X. AMÉLIORATION PAR LES AJAX CONTROLS

- XI. CONCLUSION

- XII. REMERCIEMENTS

I - INTRODUCTION

I-A - Objectif

Cet article présente avec des exemples simples les différentes techniques liées au développement d'application Web avec ASP.Net et VB.Net. Parmi celles-ci, on peut trouver :

- les Web forms ;

- les tags d'ASP.Net (dont le DataGrid) ;

- l'internationalisation par les fichiers de ressources ;

- l'accès aux données (chaîne de connexion, DataReader, Entity Framework, LINQ) ;

- la validation des formulaires ;

- la page maître ;

- la manipulation des fichiers ;

- les Ajax Controls (Ajax Control Toolkit).

I-B - Versions utilisées

Les versions utilisées des logiciels pour réaliser cet article sont :

- Microsoft .NET Framework 4.5 ;

- Microsoft® SQL Server® 2014 Express (With Tools qui a l'avantage de contenir également le SQL Management Studio) ;

- Microsoft Visual Studio Express 2013 pour le Web ;

- Ajax Control Toolkit .NET 4.5.

Pour information dans un environnement 32 bits, cela donne des fichiers avec les noms suivants :

- dotNetFx45_Full_setup.exe ;

- SQLEXPRWT_x86_FRA.exe ;

- VS2013_RTM_WebExp_FRA.iso ;

- AjaxControlToolkit.Binary.NET45.zip.

II - INSTALLATIONS

II-A - Installation du framework .Net

Lancer l'exécutable « dotNetFx45_Full_setup.exe ».

Cocher la case « J'ai lu les termes du contrat de licence et je les accepte. ».

Le logiciel d'installation procède au téléchargement des éléments et réalise l'installation.

Une fois l'installation terminée, il suffit de cliquer que le bouton « Terminer ».

II-B - Installation de SQL Server Express

Lancer l'exécutable « SQLEXPRWT_x86_FRA.exe ».

Choisir un dossier pour l'extraction des fichiers d'installation.

Les fichiers d'installation sont extraits.

Cliquer sur le lien « Nouvelle installation autonome SQL Server ou ajout de fonctionnalités à une installation existante ».

Cocher « J'accepte les termes du contrat de licence » et cliquer sur le bouton « Suivant > ».

Cocher « Utiliser Microsoft Update pour rechercher les mises à jour (recommandé) » et cliquer sur le bouton « Suivant > ».

Cliquer sur le bouton « Sélectionner tout » et cliquer sur le bouton « Suivant > ».

Cliquer sur le bouton « Suivant > ».

Cliquer sur le bouton « Suivant > ».

Cliquer sur le bouton « Suivant > ».

Le logiciel réalise l'installation.

Cliquersur le bouton « Fermer ».

Fermer le logiciel d'installation.

II-C - Installation de Visual Studio Express

Décompresser le fichier « VS2013_RTM_WebExp_FRA.iso » (avec 7-Zip par exemple).

Lancer l'exécutable « vns_full.exe ».

Cocher « J'accepte les termes du contrat de licence et la déclaration de confidentialité. ». Décocher « Adhérez au Programme d'amélioration du produit Visual Studio pour nous aider à améliorer la qualité, la fiabilité et les performances de Visual Studio (facultatif). » Cliquer sur le bouton « Installer ».

Le logiciel réalise l'installation.

Cliquer sur le bouton « Redémarrer maintenant ».

III - « BONJOUR LE MONDE ! »

Dans ce chapitre, nous allons réaliser l'exemple de plus simple : une page qui affiche « Bonjour le monde ! ».

Cela sera fait en deux étapes : une première où le texte est inscrit directement dans la page et une deuxième où le texte est stocké dans un fichier de ressources globales.

III-A - Création de l'application

Lancer « VS Express 2013 pour le Web » ().

Cliquer sur « Me le proposer ultérieurement ».

Choisir « Nouveau projet… » dans le menu « Fichier ».

Sélectionner « Application Web ASP.NET vide ». Saisir le nom du projet. Puis, cliquer sur le bouton « OK ».

III-B - Création de la page bonjour.aspx

Dans l'« Explorateur de solutions ». Choisir « Ajouter » / « Nouvel élément… ».

Choisir « Web Form ». Saisir le nom du fichier (« bonjour.aspx »). Puis cliquer sur le bouton « Ajouter ».

Saisir le code suivant dans « bonjour.aspx » :

bonjour.aspx

<%@ Page Language="vb" AutoEventWireup="false" CodeBehind="bonjour.aspx.vb" Inherits="DeveloppezAspNet.bonjour" %>

<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<title>Bonjour</title>
</head>
<body>
<form id="form1" runat="server">
<div>
Bonjour le monde.
</div>
</form>
</body>
</html>

On remarque que le code de la page est très simple pour le moment. Il ne contient (presque) que du HTML. On note tout de même la présence de la directive « Page » qui indique le fichier source contenant le code VB.Net et la balise « form » qui a un attribut « runat » qui indique que cette balise nécessite un traitement sur le serveur avant envoi vers le navigateur Web.

III-C - Lancement de la page

Lancer l'application en cliquant sur l'icône de lancement ().

Visual Studio se charge d'ouvrir une fenêtre ou un onglet dans le navigateur avec le résultat.

III-D - Externalisation des libellés dans une ressource globale

Ajouter le dossier ASP.NET « App_GlobalResources ».

Choisir d'ajouter un fichier de ressources dans le dossier ASP.NET « App_GlobalResources ».

Conserver le nom « Resource1 » et cliquer sur le bouton « OK ».

Entrer les valeurs des chaines dans le fichier de ressources.

Modifier le code de « bonjour.aspx » :

bonjour.aspx

<%@ Page Language="vb" AutoEventWireup="false" CodeBehind="bonjour.aspx.vb" Inherits="DeveloppezAspNet.bonjour" %>

<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<title><asp:Literal runat="server" Text="<%$ Resources:Resource1, titre_bonjour %>" /></title>
</head>
<body>
<form id="form1" runat="server">
<div>
<asp:Label runat="server" Text="<%$ Resources:Resource1, libelle_bonjour_le_monde %>" />
</div>
</form>
</body>
</html>

Le code ASP.Net a très peu changé. On note juste la présence des balises « asp:Label » pour indiquer que les libellés sont dans la ressource globale « Resource1 ».

Les libellés du fichier de ressources sont désormais visibles dans la page Web.

IV - AFFICHAGE DE DONNÉES EN BASE

Dans ce chapitre, nous allons réaliser une page permettant d'afficher des informations que l'on aura chargées en base par script SQL réalisant des insertions.

Nous procéderons à nouveau en plusieurs étapes. En premier, nous afficherons les valeurs d'une base locale en itérant sur les valeurs depuis le code VB.Net pour les ajouter au tableau. Ensuite, nous remplacerons ce procédé d'itérations par un contrôle DataGrid. Pour finir, nous déplacerons la base locale par une base en réseau.

IV-A - Création de la base de données en local

Ajouter le dossier ASP.NET « App_Data ».

Choisir d'ajouter un nouvel élément dans le dossier ASP.NET « App_Data ».

Choisir « Base de données SQL Server ». Saisir un nom. Cliquer sur le bouton « Ajouter ».

Ajouter une nouvelle table dans la base juste créée.

Renseigner la table LISTECOURSES. Puis cliquer sur « Mettre à jour ».

Cliquer sur le bouton « Mettre à jour la base de données ».

Choisir « Nouvelle requête ».

Saisir la requête suivante.

INSERT INTO LISTECOURSES(LIBELLE, QUANTITE) VALUES('Banane', 3);
INSERT INTO LISTECOURSES(LIBELLE, QUANTITE) VALUES('Sucre blanc', 75);
INSERT INTO LISTECOURSES(LIBELLE, QUANTITE) VALUES('Oeuf', 1);
INSERT INTO LISTECOURSES(LIBELLE, QUANTITE) VALUES('Levure', 1);
INSERT INTO LISTECOURSES(LIBELLE, QUANTITE) VALUES('Sel', 1);
INSERT INTO LISTECOURSES(LIBELLE, QUANTITE) VALUES('Farine', 150);
INSERT INTO LISTECOURSES(LIBELLE, QUANTITE) VALUES('Beurre', 70);

Exécuter la requête en cliquant sur l'icône d'exécution ().

Les enregistrements sont présents dans la base de données.

IV-B - Création de la page d'affichage

Choisir d'ajouter un fichier de ressources dans le dossier ASP.NET « App_LocalResources ».

Choisir d'ajouter un fichier de ressources dans le dossier ASP.NET « App_LocalResources ». Le nommer « liste.aspx.resx ». Entrer les valeurs des chaines dans le fichier de ressources.

Créer la page « liste.aspx ».

Modifier le code de « liste.aspx » :

liste.aspx

<%@ Page Language="vb" AutoEventWireup="false" CodeBehind="liste.aspx.vb" Inherits="DeveloppezAspNet.liste" %>

<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<title><asp:Literal runat="server" Text="<%$ Resources:titre_liste_courses %>" /></title>
</head>
<body>
<form id="form1" runat="server">
<div>
<asp:Label ID="Erreur" runat="server" Font-Bold="true" ForeColor="Red" />
</div>
<div>
<asp:Table ID="Table" runat="server" BorderWidth="1" GridLines="Both">
<asp:TableHeaderRow runat="server">
<asp:TableHeaderCell><asp:Literal runat="server" Text="<%$ Resources:colonne_identifiant %>" /></asp:TableHeaderCell>
<asp:TableHeaderCell><asp:Literal runat="server" Text="<%$ Resources:colonne_libelle %>" /></asp:TableHeaderCell>
<asp:TableHeaderCell><asp:Literal runat="server" Text="<%$ Resources:colonne_quantite %>" /></asp:TableHeaderCell>
</asp:TableHeaderRow>
</asp:Table>
</div>
</form>
</body>
</html>

La page ASP.Net contient un tableau vide. On remarque que les balises « asp:Table », « asp:TableHeaderRow » et « asp:TableHeaderCell » ont également un attribut « runat ».

Modifier le code de « liste.aspx.vb » :

liste.aspx.vb

Imports System.Data.SqlClient

Public Class liste
Inherits System.Web.UI.Page

Protected Sub Page_Load(ByVal sender As Object, ByVal e As System.EventArgs) Handles Me.Load
Dim MyConnexion As SqlConnection = Nothing
Try
MyConnexion = New SqlConnection("Data Source=(LocalDB)\v11.0;" & _
"AttachDbFilename=|DataDirectory|\Database1.mdf;" & _
"Integrated Security=True;")
Dim MyCommand As SqlCommand = New SqlCommand("SELECT * FROM LISTECOURSES", MyConnexion)
MyConnexion.Open()
Dim MyReader As SqlDataReader = MyCommand.ExecuteReader
If MyReader.HasRows Then
Do While MyReader.Read
Dim MyRow As TableRow = New TableRow
Dim MyCellId As TableCell = New TableCell
Dim MyCellLibelle As TableCell = New TableCell
Dim MyCellQuantite As TableCell = New TableCell

MyCellId.Text = MyReader.GetInt32(0)
MyCellLibelle.Text = MyReader.GetString(1)
MyCellQuantite.HorizontalAlign = HorizontalAlign.Right
MyCellQuantite.Text = MyReader.GetInt32(2)

MyRow.Cells.Add(MyCellId)
MyRow.Cells.Add(MyCellLibelle)
MyRow.Cells.Add(MyCellQuantite)
Table.Rows.Add(MyRow)
Loop
Else
Erreur.Text = "Pas de lignes de résultat"
End If
Catch MyException As Exception
Erreur.Text = MyException.Message
Finally
If Not IsNothing(MyConnexion) Then
If MyConnexion.State = ConnectionState.Open Then
MyConnexion.Close()
End If
End If
End Try
End Sub

End Class

Le code VB.Net utilise une Command et un DataReader pour récupérer les valeurs en base et ajouter des lignes au tableau. On peut noter que l'éventuel message d'erreur est affiché grâce à une balise « asp:Label ».

Cela donne le résultat suivant :

IV-C - Modification pour utiliser un DataGrid

Modifier le code de « liste.aspx » :

liste.aspx

<%@ Page Language="vb" AutoEventWireup="false" CodeBehind="liste.aspx.vb" Inherits="DeveloppezAspNet.liste" %>

<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<title><asp:Literal runat="server" Text="<%$ Resources:titre_liste_courses %>" /></title>
</head>
<body>
<form id="form1" runat="server">
<div>
<asp:Label ID="Erreur" runat="server" Font-Bold="true" ForeColor="Red" />
</div>
<div>
<asp:DataGrid ID="DataGrid" runat="server" BorderWidth="1" GridLines="Both" AutoGenerateColumns="false">
<Columns>
<asp:BoundColumn DataField="IDOBJET" HeaderText="<%$ Resources:colonne_identifiant %>" />
<asp:BoundColumn DataField="LIBELLE" HeaderText="<%$ Resources:colonne_libelle %>" />
<asp:BoundColumn DataField="QUANTITE" HeaderText="<%$ Resources:colonne_quantite %>" ItemStyle-HorizontalAlign="Right" />
</Columns>
</asp:DataGrid>
</div>
</form>
</body>
</html>

Modifier le code de « liste.aspx.vb » :

liste.aspx.vb

Imports System.Data.SqlClient

Public Class liste
Inherits System.Web.UI.Page

Protected Sub Page_Load(ByVal sender As Object, ByVal e As System.EventArgs) Handles Me.Load
Dim MyConnexion As SqlConnection = Nothing
Try
MyConnexion = New SqlConnection("Data Source=(LocalDB)\v11.0;" & _
"AttachDbFilename=|DataDirectory|\Database1.mdf;" & _
"Integrated Security=True;")
Dim MyCommand As SqlCommand = New SqlCommand("SELECT * FROM LISTECOURSES", MyConnexion)
MyConnexion.Open()
Dim MyReader As SqlDataReader = MyCommand.ExecuteReader
DataGrid.DataSource = MyReader
DataGrid.DataBind()
Catch MyException As Exception
Erreur.Text = MyException.Message
Finally
If Not IsNothing(MyConnexion) Then
If MyConnexion.State = ConnectionState.Open Then
MyConnexion.Close()
End If
End If
End Try
End Sub

End Class

Dans la page ASP.Net, le tableau est remplacé par un contrôle DataGrid. Le code VB.Net devient plus simple, car le DataReader est directement traité par le contrôle DataGrid.

Cela donne le résultat suivant :

IV-D - Création de la base de données en réseau

Lancer « SQL Server 2014 Management Studio » ().

Cliquer sur le bouton « Se conn. ».

Cliquer sur « Nouvelle base de données… ».

Saisir le « Nom de la base de données ». Puis, cliquer sur « OK ».

Sélectionner la base de données créée et cliquer sur « Nouvelle requête » ().

Saisir la requête SQL suivante qui est similaire à celle d'insertion du chapitre IV-A avec en plus la création de la table LISTECOURSES.

CREATE TABLE LISTECOURSES (
IDOBJET INT NOT NULL PRIMARY KEY IDENTITY,
LIBELLE NVARCHAR(50) NULL,
QUANTITE INT NULL
);

INSERT INTO LISTECOURSES(LIBELLE, QUANTITE) VALUES('Banane', 3);
INSERT INTO LISTECOURSES(LIBELLE, QUANTITE) VALUES('Sucre blanc', 75);
INSERT INTO LISTECOURSES(LIBELLE, QUANTITE) VALUES('Oeuf', 1);
INSERT INTO LISTECOURSES(LIBELLE, QUANTITE) VALUES('Levure', 1);
INSERT INTO LISTECOURSES(LIBELLE, QUANTITE) VALUES('Sel', 1);
INSERT INTO LISTECOURSES(LIBELLE, QUANTITE) VALUES('Farine', 150);
INSERT INTO LISTECOURSES(LIBELLE, QUANTITE) VALUES('Beurre', 70);
INSERT INTO LISTECOURSES(LIBELLE, QUANTITE) VALUES('Cacao', 250);

Exécuter la requête en cliquant sur le bouton « Exécuter » ().

IV-E - Modification pour utiliser la base en réseau

Modifier le code de « liste.aspx.vb » :

liste.aspx.vb

Imports System.Data.SqlClient

Public Class liste
Inherits System.Web.UI.Page

Protected Sub Page_Load(ByVal sender As Object, ByVal e As System.EventArgs) Handles Me.Load
Dim MyConnexion As SqlConnection = Nothing
Try
'MyConnexion = New SqlConnection("Data Source=(LocalDB)\v11.0;" & _
'                                                     "AttachDbFilename=|DataDirectory|\Database1.mdf;" & _
'                                                     "Integrated Security=True;")
MyConnexion = New SqlConnection("Data Source=.\SQLEXPRESS;Initial Catalog=dataDev;Integrated Security=True")
Dim MyCommand As SqlCommand = New SqlCommand("SELECT * FROM LISTECOURSES", MyConnexion)
MyConnexion.Open()
Dim MyReader As SqlDataReader = MyCommand.ExecuteReader
DataGrid.DataSource = MyReader
DataGrid.DataBind()
Catch MyException As Exception
Erreur.Text = MyException.Message
Finally
If Not IsNothing(MyConnexion) Then
If MyConnexion.State = ConnectionState.Open Then
MyConnexion.Close()
End If
End If
End Try
End Sub

End Class

La seule modification se situe au niveau de la chaine de connexion à la base de données.

Cela donne le résultat suivant :

V - CRÉATION DE DONNÉES EN BASE

Le but de ce chapitre est de créer des données dans la base de données depuis l'application. Cela permettra de voir le mécanisme de validation des données provenant du formulaire et la modification des données en base depuis du code VB.Net.

Choisir d'ajouter un fichier de ressources dans le dossier ASP.NET « App_LocalResources ». Le nommer « creation.aspx.resx ». Entrer les valeurs des chaines dans le fichier de ressources.

Créer la page « creation.aspx ».

Modifier le fichier « Web.config » :

Web.config

<?xml version="1.0" encoding="utf-8"?>

<!--
Pour plus d'informations sur la configuration de votre application ASP.NET, consultez
http://go.microsoft.com/fwlink/?LinkId=169433
-->

<configuration>
<system.web>
<compilation debug="true" strict="false" explicit="true" targetFramework="4.5" />
<httpRuntime targetFramework="4.5"  />
</system.web>
<appSettings>
<add key="ValidationSettings:UnobtrusiveValidationMode" value="None" />
</appSettings>
</configuration>

Modifier le code de « creation.aspx » :

creation.aspx

<%@ Page Language="vb" AutoEventWireup="false" CodeBehind="creation.aspx.vb" Inherits="DeveloppezAspNet.creation" %>

<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<title><asp:Literal runat="server" Text="<%$ Resources:titre_creation_element_courses %>" /></title>
</head>
<body>
<form id="form1" runat="server">
<div>
<table>
<tr>
<td colspan="3">
<asp:ValidationSummary runat="server" ForeColor="Red" />
</td>
</tr>
<tr>
<td>
<asp:RequiredFieldValidator runat="server" ControlToValidate="TextLibelle"
ForeColor="Red"
Display="Dynamic"
ErrorMessage="<%$ Resources:creation_libelle_erreur_obligatoire %>" >*
</asp:RequiredFieldValidator>
</td>
<td>
<asp:Label runat="server" Text="<%$ Resources:creation_element_courses_libelle_libelle %>" /> :
</td>
<td>
<asp:TextBox ID="TextLibelle" runat="server" Text="" />
</td>
</tr>
<tr>
<td>
<asp:RequiredFieldValidator runat="server" ControlToValidate="TextQuantite"
ForeColor="Red"
Display="Dynamic"
ErrorMessage="<%$ Resources:creation_quantite_erreur_obligatoire %>" >*
</asp:RequiredFieldValidator>
<asp:RegularExpressionValidator runat="server" ControlToValidate="TextQuantite"
ForeColor="Red"
Display="Dynamic"
ValidationExpression="[0-9]*"
ErrorMessage="<%$ Resources:creation_quantite_erreur_numerique %>" >*
</asp:RegularExpressionValidator>
</td>
<td>
<asp:Label runat="server" Text="<%$ Resources:creation_element_courses_libelle_quantite %>" /> :
</td>
<td>
<asp:TextBox ID="TextQuantite" runat="server" Text="" />
</td>
</tr>
<tr>
<td colspan="3">
<asp:Button ID="ButtonValider" runat="server" Text="<%$ Resources:creation_element_courses_libelle_valider %>" />
</td>
</tr>
</table>
</div>
<div>
<asp:Label ID="Erreur" runat="server" Font-Bold="true" ForeColor="Red" />
</div>
<div>
<asp:DataGrid ID="DataGrid" runat="server" BorderWidth="1" GridLines="Both" AutoGenerateColumns="false">
<Columns>
<asp:BoundColumn DataField="IDOBJET" HeaderText="<%$ Resources:colonne_identifiant %>" />
<asp:BoundColumn DataField="LIBELLE" HeaderText="<%$ Resources:colonne_libelle %>" />
<asp:BoundColumn DataField="QUANTITE" HeaderText="<%$ Resources:colonne_quantite %>" ItemStyle-HorizontalAlign="Right" />
</Columns>
</asp:DataGrid>
</div>
</form>
</body>
</html>

Dans la page ASP.Net, la balise « asp:ValidationSummary » permet d'afficher les différentes erreurs de validation. Les balises « asp:RequiredFieldValidator » et « asp:RegularExpressionValidator » valident les données du formulaire.

Modifier le code de « creation.aspx.vb » :

creation.aspx.vb

Imports System.Data.SqlClient

Public Class creation
Inherits System.Web.UI.Page

Private Sub Charger()
Dim MyConnexion As SqlConnection = Nothing
Try
MyConnexion = New SqlConnection("Data Source=.\SQLEXPRESS;Initial Catalog=dataDev;Integrated Security=True")
Dim MyCommand As SqlCommand = New SqlCommand("SELECT * FROM LISTECOURSES", MyConnexion)
MyConnexion.Open()
Dim MyReader As SqlDataReader = MyCommand.ExecuteReader
DataGrid.DataSource = MyReader
DataGrid.DataBind()
Catch MyException As Exception
Erreur.Text = MyException.Message
Finally
If Not IsNothing(MyConnexion) Then
If MyConnexion.State = ConnectionState.Open Then
MyConnexion.Close()
End If
End If
End Try
End Sub

Protected Sub Page_Load(ByVal sender As Object, ByVal e As System.EventArgs) Handles Me.Load
Charger()
End Sub

Private Sub ButtonValider_Click(sender As Object, e As EventArgs) Handles ButtonValider.Click
Dim MyConnexion As SqlConnection = Nothing
Try
MyConnexion = New SqlConnection("Data Source=.\SQLEXPRESS;Initial Catalog=dataDev;Integrated Security=True")
Dim MyCommand As SqlCommand = New SqlCommand("INSERT INTO LISTECOURSES(LIBELLE, QUANTITE) VALUES(@Libelle, @Quantite);", MyConnexion)
MyCommand.Parameters.Add("@Libelle", SqlDbType.NVarChar).Value = TextLibelle.Text
MyCommand.Parameters.Add("@Quantite", SqlDbType.Int).Value = CInt(TextQuantite.Text)
MyConnexion.Open()
MyCommand.ExecuteNonQuery()
Charger()
Catch MyException As Exception
Erreur.Text = MyException.Message
Finally
If Not IsNothing(MyConnexion) Then
If MyConnexion.State = ConnectionState.Open Then
MyConnexion.Close()
End If
End If
End Try
End Sub
End Class

Le code VB.Net utilise une requête paramétrée pour insérer un nouvel enregistrement en base de données.

Cela donne le résultat suivant :

Voici les messages d'erreur lorsque les champs ne sont pas renseignés.

Voici le message d'erreur lorsque le champ numérique n'est pas respecté :

Lorsque les champs sont correctement renseignés, l'application stocke les valeurs et les affiche dans la liste.

VI - SUPPRESSION DE DONNÉES EN BASE

Dans ce chapitre, nous réaliserons une page avec un tableau listant les enregistrements de la table avec un bouton permettant de supprimer un de ces enregistrements.

Choisir d'ajouter un fichier de ressources dans le dossier ASP.NET « App_LocalResources ». Le nommer « suppression.aspx.resx ». Entrer les valeurs des chaines dans le fichier de ressources.

Créer la page « suppression.aspx ».

Modifier le code de « suppression.aspx » :

suppression.aspx

<%@ Page Language="vb" AutoEventWireup="false" CodeBehind="suppression.aspx.vb" Inherits="DeveloppezAspNet.suppression" %>

<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<title><asp:Literal runat="server" Text="<%$ Resources:titre_suppression_element_courses %>" /></title>
</head>
<body>
<form id="form1" runat="server">
<div>
<asp:Label ID="Erreur" runat="server" Font-Bold="true" ForeColor="Red" />
</div>
<div>
<asp:DataGrid ID="DataGrid" runat="server" BorderWidth="1" GridLines="Both" AutoGenerateColumns="false">
<Columns>
<asp:BoundColumn DataField="IDOBJET" HeaderText="<%$ Resources:colonne_identifiant %>" />
<asp:BoundColumn DataField="LIBELLE" HeaderText="<%$ Resources:colonne_libelle %>" />
<asp:BoundColumn DataField="QUANTITE" HeaderText="<%$ Resources:colonne_quantite %>" ItemStyle-HorizontalAlign="Right" />
<asp:ButtonColumn CommandName="Delete" Text="<%$ Resources:suppression_supprimer_libelle %>" />
</Columns>
</asp:DataGrid>
</div>
</form>
</body>
</html>

Dans la page ASP.Net, nous avons encore une petite nouveauté : « asp:ButtonColumn » qui permet d'avoir une colonne avec le bouton de suppression.

Modifier le code de « suppression.aspx.vb » :

suppression.aspx.vb

Imports System.Web.UI.WebControls
Imports System.Data.SqlClient

Public Class suppression
Inherits System.Web.UI.Page

Private Sub Charger()
Dim MyConnexion As SqlConnection = Nothing
Try
MyConnexion = New SqlConnection("Data Source=.\SQLEXPRESS;Initial Catalog=dataDev;Integrated Security=True")
Dim MyCommand As SqlCommand = New SqlCommand("SELECT * FROM LISTECOURSES", MyConnexion)
Dim MyAdapter As SqlDataAdapter = New SqlDataAdapter(MyCommand)
Dim MyDataTable As DataTable = New DataTable("LISTECOURSES")
MyAdapter.Fill(MyDataTable)
DataGrid.DataSource = MyDataTable
DataGrid.DataBind()
Catch MyException As Exception
Erreur.Text = MyException.Message
Finally
If Not IsNothing(MyConnexion) Then
If MyConnexion.State = ConnectionState.Open Then
MyConnexion.Close()
End If
End If
End Try
End Sub

Protected Sub Page_Load(ByVal sender As Object, ByVal e As System.EventArgs) Handles Me.Load
Charger()
End Sub

Private Sub DataGrid_DeleteCommand(source As Object, e As DataGridCommandEventArgs) Handles DataGrid.DeleteCommand
Dim item As DataGridItem = CType(e.Item, DataGridItem)

Dim MyConnexion As SqlConnection = Nothing
Try
MyConnexion = New SqlConnection("Data Source=.\SQLEXPRESS;Initial Catalog=dataDev;Integrated Security=True")
Dim MyCommand As SqlCommand = New SqlCommand("SELECT * FROM LISTECOURSES", MyConnexion)
Dim MyAdapter As SqlDataAdapter = New SqlDataAdapter(MyCommand)
Dim MyDataTable As DataTable = New DataTable("LISTECOURSES")
MyAdapter.Fill(MyDataTable)
Dim IdObjet As Integer = CInt(e.Item.Cells(0).Text)
Dim MyDataRows As DataRow() = MyDataTable.Select("IDOBJET = " & IdObjet)
MyDataRows(0).Delete()
Dim MyCommandBuilder As SqlCommandBuilder = New SqlCommandBuilder(MyAdapter)
MyAdapter.DeleteCommand = MyCommandBuilder.GetDeleteCommand
MyAdapter.Update(MyDataTable)
DataGrid.DataSource = MyDataTable
DataGrid.DataBind()
Catch MyException As Exception
Erreur.Text = MyException.Message
Finally
If Not IsNothing(MyConnexion) Then
If MyConnexion.State = ConnectionState.Open Then
MyConnexion.Close()
End If
End If
End Try
End Sub
End Class

Le code VB.Net utilise une « DataTable » pour manipuler les données. Puis, la suppression est réalisée grâce à un « CommandBuilder » en base de données sans avoir besoin d'utiliser du SQL.

Cela donne le résultat suivant :

Lorsque l'on clique sur un « supprimer » (le dernier dans ce cas), l'application supprime l'enregistrement et affiche le résultat.

VII - MODIFICATION DE DONNÉES EN BASE

Dans ce chapitre, nous allons modifier les données en utilisant les possibilités d'édition du contrôle DataGrid et Entity Framework.

Choisir d'ajouter un fichier de ressources dans le dossier ASP.NET « App_LocalResources ». Le nommer « modification.aspx.resx ». Entrer les valeurs des chaines dans le fichier de ressources.

Créer la page « modification.aspx ».

Dans l'« Explorateur de solutions ». Choisir « Ajouter » / « Nouvel élément… ».

Choisir « ADO.NET Entity Data Model ». Saisir le nom du fichier (« DataModel.edmx »). Puis cliquer sur le bouton « Ajouter ».

Cliquer sur « Suivant ».

Cliquer sur le bouton « Nouvelle connexion ».

Entrer les valeurs. Puis, cliquer sur le bouton « OK ».

Saisir « dataEntities ». Puis, cliquer sur le bouton « Suivant ».

Cliquer sur le bouton « Suivant ».

Cocher la table « LISTECOURSES ». Saisir « dataModel ». Puis, cliquer sur le bouton « Suivant ».

Le fichier « DataModel.edmx » contient les tables pour lesquelles une entité a été générée.

Modifier le code de « modification.aspx » :

modification.aspx

<%@ Page Language="vb" AutoEventWireup="false" CodeBehind="modification.aspx.vb" Inherits="DeveloppezAspNet.modification" %>

<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<title><asp:Literal runat="server" Text="<%$ Resources:titre_modification_element_courses %>" /></title>
</head>
<body>
<form id="form1" runat="server">
<div>
<asp:ValidationSummary runat="server" ForeColor="Red" />
</div>
<div>
<asp:DataGrid ID="DataGrid" runat="server" BorderWidth="1" GridLines="Both" AutoGenerateColumns="false">
<Columns>
<asp:BoundColumn DataField="IDOBJET" HeaderText="<%$ Resources:colonne_identifiant %>" ReadOnly="True" />
<asp:TemplateColumn HeaderText="<%$ Resources:colonne_libelle %>" >
<EditItemTemplate>
<asp:TextBox ID="textLibelle" runat="server" Text="<%# Bind('LIBELLE')%>" />
<asp:RequiredFieldValidator runat="server" ControlToValidate="textLibelle"
ForeColor="Red"
Display="Dynamic"
ErrorMessage="<%$ Resources:modification_libelle_erreur_obligatoire %>" >*
</asp:RequiredFieldValidator>
</EditItemTemplate>
<ItemTemplate>
<asp:Label ID="labelLibelle" runat="server" Text="<%# Bind('LIBELLE')%>" />
</ItemTemplate>
</asp:TemplateColumn>
<asp:TemplateColumn HeaderText="<%$ Resources:colonne_quantite %>" >
<EditItemTemplate>
<asp:TextBox ID="textQuantite" runat="server" Text="<%# Bind('QUANTITE')%>" />
<asp:RequiredFieldValidator runat="server" ControlToValidate="textQuantite"
ForeColor="Red"
Display="Dynamic"
ErrorMessage="<%$ Resources:modification_quantite_erreur_obligatoire %>" >*
</asp:RequiredFieldValidator>
<asp:RegularExpressionValidator runat="server" ControlToValidate="textQuantite"
ForeColor="Red"
Display="Dynamic"
ValidationExpression="[0-9]*"
ErrorMessage="<%$ Resources:modification_quantite_erreur_numerique %>" >*
</asp:RegularExpressionValidator>
</EditItemTemplate>
<ItemTemplate>
<asp:Label ID="labelQuantite" runat="server" Text="<%# Bind('QUANTITE')%>" />
</ItemTemplate>
</asp:TemplateColumn>
<asp:EditCommandColumn ButtonType="PushButton"
EditText="<%$ Resources:modification_element_courses_libelle_modifier %>"
UpdateText="<%$ Resources:modification_element_courses_libelle_valider %>"
CancelText="<%$ Resources:modification_element_courses_libelle_annuler %>" />
</Columns>
</asp:DataGrid>
</div>
</form>
</body>
</html>

Dans la page ASP.Net, la balise « asp:TemplateColumn » contient les balises « EditItemTemplate » et « ItemTemplate » qui permettent de définir le mode d'édition et d'affichage des valeurs.

Modifier le code de « modification.aspx.vb » :

modification.aspx.vb

Public Class modification
Inherits System.Web.UI.Page

Private Sub Charger()
Dim Entities = New dataEntities()
Dim Query = From Entity In Entities.LISTECOURSES
Select Entity

DataGrid.DataSource = Query.ToList
DataGrid.DataBind()
End Sub

Protected Sub Page_Load(ByVal sender As Object, ByVal e As System.EventArgs) Handles Me.Load
If Not Page.IsPostBack Then
Charger()
End If
End Sub

Private Sub DataGrid_CancelCommand(source As Object, e As DataGridCommandEventArgs) Handles DataGrid.CancelCommand
DataGrid.EditItemIndex = -1
Charger()
End Sub

Private Sub DataGrid_EditCommand(source As Object, e As DataGridCommandEventArgs) Handles DataGrid.EditCommand
DataGrid.EditItemIndex = e.Item.ItemIndex
Charger()
End Sub

Private Sub DataGrid_UpdateCommand(source As Object, e As DataGridCommandEventArgs) Handles DataGrid.UpdateCommand
DataGrid.EditItemIndex = -1

Dim IdentifiantText = e.Item.Cells(0).Text
Dim Identifiant = CType(IdentifiantText, Integer)
Dim LibelleText = CType(e.Item.Cells(1).Controls(1), TextBox).Text
Dim QuantiteText = CType(e.Item.Cells(2).Controls(1), TextBox).Text
Dim Quantite = CType(QuantiteText, Integer)

Dim Entities = New dataEntities()
Dim Query = From Entity In Entities.LISTECOURSES
Where Entity.IDOBJET = Identifiant

Dim Course = Query.Single
Course.LIBELLE = LibelleText
Course.QUANTITE = Quantite
Entities.SaveChanges()

Charger()
End Sub
End Class

Le code VB.Net contient l'utilisation d'Entity Framework et de LINQ.

Cela donne le résultat suivant :

Voici les messages d'erreur lorsque les champs ne sont pas renseignés :

Voici le message d'erreur lorsque le champ numérique n'est pas respecté :

Lorsque les champs sont correctement renseignés, l'application stocke les nouvelles valeurs et les affiche dans la liste.

VIII - UNIFICATION DE L'APPLICATION PAR UN MENU

Dans ce chapitre, nous allons utiliser une page maître afin de réaliser un menu commun à toutes les pages précédemment créées.

Choisir d'ajouter un fichier de ressources dans le dossier ASP.NET « App_GlobalResources ». Le nommer « Titres.resx ». Entrer les valeurs des chaines dans le fichier de ressources.

Dans l'« Explorateur de solutions ». Choisir « Ajouter » / « Nouvel élément… ».

Choisir « Page maître Web Forms ». Saisir le nom du fichier (« Site.Master »). Puis cliquer sur le bouton « Ajouter ».

Modifier le code de « Site.Master » :

Site.Master

<%@ Master Language="VB" AutoEventWireup="false" CodeBehind="Site.master.vb" Inherits="DeveloppezAspNet.Site" %>

<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<title><asp:ContentPlaceHolder ID="Titre" runat="server" /></title>
</head>
<body>
<form id="form1" runat="server">
<table>
<tbody>
<tr>
<td valign="top">
<table width="150px" border="1">
<tbody>
<tr>
<td>
<a href="bonjour.aspx"><asp:Literal runat="server" Text="<%$ Resources:Titres, titre_bonjour %>" /></a>
</td>
</tr>
<tr>
<td>
<a href="liste.aspx"><asp:Literal runat="server" Text="<%$ Resources:Titres, titre_liste %>" /></a>
</td>
</tr>
<tr>
<td>
<a href="creation.aspx"><asp:Literal runat="server" Text="<%$ Resources:Titres, titre_creation %>" /></a>
</td>
</tr>
<tr>
<td>
<a href="suppression.aspx"><asp:Literal runat="server" Text="<%$ Resources:Titres, titre_suppression %>" /></a>
</td>
</tr>
<tr>
<td>
<a href="modification.aspx"><asp:Literal runat="server" Text="<%$ Resources:Titres, titre_modification %>" /></a>
</td>
</tr>
</tbody>
</table>
</td>
<td valign="top">
<asp:ContentPlaceHolder ID="Contenu" runat="server" />
</td>
</tr>
</tbody>
</table>
</form>
</body>
</html>

La page maître contient deux balises « asp:ContentPlaceHolder » qui indiquent deux points d'insertion dont le contenu est à définir dans les pages utilisant la page maître. Les différentes pages sont modifiées pour indiquer qu'elles ont une page maître. Elles utilisent la balise « asp:Content » pour déterminer le contenu des points d'insertion.

Modifier le code de « bonjour.aspx » :

bonjour.aspx

<%@ Page Language="vb" AutoEventWireup="false" MasterPageFile="~/Site.Master" CodeBehind="bonjour.aspx.vb" Inherits="DeveloppezAspNet.bonjour" %>

<asp:Content runat="server" ID="Titre" ContentPlaceHolderID="Titre">
<asp:Literal runat="server" Text="<%$ Resources:Resource1, titre_bonjour %>" />
</asp:Content>
<asp:Content runat="server" ID="Contenu" ContentPlaceHolderID="Contenu">
<div>
<asp:Label runat="server" Text="<%$ Resources:Resource1, libelle_bonjour_le_monde %>" />
</div>
</asp:Content>

Modifier le code de « liste.aspx » :

liste.aspx

<%@ Page Language="vb" AutoEventWireup="false" MasterPageFile="~/Site.Master" CodeBehind="liste.aspx.vb" Inherits="DeveloppezAspNet.liste" %>

<asp:Content runat="server" ID="Titre" ContentPlaceHolderID="Titre">
<asp:Literal runat="server" Text="<%$ Resources:titre_liste_courses %>" />
</asp:Content>
<asp:Content runat="server" ID="Contenu" ContentPlaceHolderID="Contenu">
<div>
<asp:Label ID="Erreur" runat="server" Font-Bold="true" ForeColor="Red" />
</div>
<div>
<asp:DataGrid ID="DataGrid" runat="server" BorderWidth="1" GridLines="Both" AutoGenerateColumns="false">
<Columns>
<asp:BoundColumn DataField="IDOBJET" HeaderText="<%$ Resources:colonne_identifiant %>" />
<asp:BoundColumn DataField="LIBELLE" HeaderText="<%$ Resources:colonne_libelle %>" />
<asp:BoundColumn DataField="QUANTITE" HeaderText="<%$ Resources:colonne_quantite %>" ItemStyle-HorizontalAlign="Right" />
</Columns>
</asp:DataGrid>
</div>
</asp:Content>

Modifier le code de « creation.aspx » :

creation.aspx

<%@ Page Language="vb" AutoEventWireup="false" MasterPageFile="~/Site.Master" CodeBehind="creation.aspx.vb" Inherits="DeveloppezAspNet.creation" %>

<asp:Content runat="server" ID="Titre" ContentPlaceHolderID="Titre">
<asp:Literal runat="server" Text="<%$ Resources:titre_creation_element_courses %>" />
</asp:Content>
<asp:Content runat="server" ID="Contenu" ContentPlaceHolderID="Contenu">
<div>
<table>
<tr>
<td colspan="3">
<asp:ValidationSummary runat="server" ForeColor="Red" />
</td>
</tr>
<tr>
<td>
<asp:RequiredFieldValidator runat="server" ControlToValidate="TextLibelle"
ForeColor="Red"
Display="Dynamic"
ErrorMessage="<%$ Resources:creation_libelle_erreur_obligatoire %>" >*
</asp:RequiredFieldValidator>
</td>
<td>
<asp:Label runat="server" Text="<%$ Resources:creation_element_courses_libelle_libelle %>" /> :
</td>
<td>
<asp:TextBox ID="TextLibelle" runat="server" Text="" />
</td>
</tr>
<tr>
<td>
<asp:RequiredFieldValidator runat="server" ControlToValidate="TextQuantite"
ForeColor="Red"
Display="Dynamic"
ErrorMessage="<%$ Resources:creation_quantite_erreur_obligatoire %>" >*
</asp:RequiredFieldValidator>
<asp:RegularExpressionValidator runat="server" ControlToValidate="TextQuantite"
ForeColor="Red"
Display="Dynamic"
ValidationExpression="[0-9]*"
ErrorMessage="<%$ Resources:creation_quantite_erreur_numerique %>" >*
</asp:RegularExpressionValidator>
</td>
<td>
<asp:Label runat="server" Text="<%$ Resources:creation_element_courses_libelle_quantite %>" /> :
</td>
<td>
<asp:TextBox ID="TextQuantite" runat="server" Text="" />
</td>
</tr>
<tr>
<td colspan="3">
<asp:Button ID="ButtonValider" runat="server" Text="<%$ Resources:creation_element_courses_libelle_valider %>" />
</td>
</tr>
</table>
</div>
<div>
<asp:Label ID="Erreur" runat="server" Font-Bold="true" ForeColor="Red" />
</div>
<div>
<asp:DataGrid ID="DataGrid" runat="server" BorderWidth="1" GridLines="Both" AutoGenerateColumns="false">
<Columns>
<asp:BoundColumn DataField="IDOBJET" HeaderText="<%$ Resources:colonne_identifiant %>" />
<asp:BoundColumn DataField="LIBELLE" HeaderText="<%$ Resources:colonne_libelle %>" />
<asp:BoundColumn DataField="QUANTITE" HeaderText="<%$ Resources:colonne_quantite %>" ItemStyle-HorizontalAlign="Right" />
</Columns>
</asp:DataGrid>
</div>
</asp:Content>

Modifier le code de « supression.aspx » :

supression.aspx

<%@ Page Language="vb" AutoEventWireup="false" MasterPageFile="~/Site.Master" CodeBehind="suppression.aspx.vb" Inherits="DeveloppezAspNet.suppression" %>

<asp:Content runat="server" ID="Titre" ContentPlaceHolderID="Titre">
<asp:Literal runat="server" Text="<%$ Resources:titre_suppression_element_courses %>" />
</asp:Content>
<asp:Content runat="server" ID="Contenu" ContentPlaceHolderID="Contenu">
<div>
<asp:Label ID="Erreur" runat="server" Font-Bold="true" ForeColor="Red" />
</div>
<div>
<asp:DataGrid ID="DataGrid" runat="server" BorderWidth="1" GridLines="Both" AutoGenerateColumns="false">
<Columns>
<asp:BoundColumn DataField="IDOBJET" HeaderText="<%$ Resources:colonne_identifiant %>" />
<asp:BoundColumn DataField="LIBELLE" HeaderText="<%$ Resources:colonne_libelle %>" />
<asp:BoundColumn DataField="QUANTITE" HeaderText="<%$ Resources:colonne_quantite %>" ItemStyle-HorizontalAlign="Right" />
<asp:ButtonColumn CommandName="Delete" Text="<%$ Resources:suppression_supprimer_libelle %>" />
</Columns>
</asp:DataGrid>
</div>
</asp:Content>

Modifier le code de « modification.aspx » :

modification.aspx

<%@ Page Language="vb" AutoEventWireup="false" MasterPageFile="~/Site.Master" CodeBehind="modification.aspx.vb" Inherits="DeveloppezAspNet.modification" %>

<asp:Content runat="server" ID="Titre" ContentPlaceHolderID="Titre">
<asp:Literal runat="server" Text="<%$ Resources:titre_modification_element_courses %>" />
</asp:Content>
<asp:Content runat="server" ID="Contenu" ContentPlaceHolderID="Contenu">
<div>
<asp:ValidationSummary runat="server" ForeColor="Red" />
</div>
<div>
<asp:DataGrid ID="DataGrid" runat="server" BorderWidth="1" GridLines="Both" AutoGenerateColumns="false">
<Columns>
<asp:BoundColumn DataField="IDOBJET" HeaderText="<%$ Resources:colonne_identifiant %>" ReadOnly="True" />
<asp:TemplateColumn HeaderText="<%$ Resources:colonne_libelle %>" >
<EditItemTemplate>
<asp:TextBox ID="textLibelle" runat="server" Text="<%# Bind('LIBELLE')%>" />
<asp:RequiredFieldValidator runat="server" ControlToValidate="textLibelle"
ForeColor="Red"
Display="Dynamic"
ErrorMessage="<%$ Resources:modification_libelle_erreur_obligatoire %>" >*
</asp:RequiredFieldValidator>
</EditItemTemplate>
<ItemTemplate>
<asp:Label ID="labelLibelle" runat="server" Text="<%# Bind('LIBELLE')%>" />
</ItemTemplate>
</asp:TemplateColumn>
<asp:TemplateColumn HeaderText="<%$ Resources:colonne_quantite %>" >
<EditItemTemplate>
<asp:TextBox ID="textQuantite" runat="server" Text="<%# Bind('QUANTITE')%>" />
<asp:RequiredFieldValidator runat="server" ControlToValidate="textQuantite"
ForeColor="Red"
Display="Dynamic"
ErrorMessage="<%$ Resources:modification_quantite_erreur_obligatoire %>" >*
</asp:RequiredFieldValidator>
<asp:RegularExpressionValidator runat="server" ControlToValidate="textQuantite"
ForeColor="Red"
Display="Dynamic"
ValidationExpression="[0-9]*"
ErrorMessage="<%$ Resources:modification_quantite_erreur_numerique %>" >*
</asp:RegularExpressionValidator>
</EditItemTemplate>
<ItemTemplate>
<asp:Label ID="labelQuantite" runat="server" Text="<%# Bind('QUANTITE')%>" />
</ItemTemplate>
</asp:TemplateColumn>
<asp:EditCommandColumn ButtonType="PushButton"
EditText="<%$ Resources:modification_element_courses_libelle_modifier %>"
UpdateText="<%$ Resources:modification_element_courses_libelle_valider %>"
CancelText="<%$ Resources:modification_element_courses_libelle_annuler %>" />
</Columns>
</asp:DataGrid>
</div>
</asp:Content>

Cela donne le résultat suivant :

IX - MANIPULATION DES FICHIERS

IX-A - Écriture d'un fichier texte

Maintenant, nous allons modifier la page d'affichage des données de la base pour ajouter un bouton qui crée un fichier contenant la liste de ces données.

Ajouter la correspondance suivante dans « liste.aspx.resx » (Clic droit sur le fichier puis « Ouvrir avec… » / « Éditeur XML (Texte) avec encodage ») :

liste.aspx.resx

<data name="creation_fichier" xml:space="preserve">
<value>Création d'un fichier avec la liste</value>
</data>

Modifier le code de « liste.aspx » :

liste.aspx

<%@ Page Language="vb" AutoEventWireup="false" MasterPageFile="~/Site.Master" CodeBehind="liste.aspx.vb" Inherits="DeveloppezAspNet.liste" %>

<asp:Content runat="server" ID="Titre" ContentPlaceHolderID="Titre">
<asp:Literal runat="server" Text="<%$ Resources:titre_liste_courses %>" />
</asp:Content>
<asp:Content runat="server" ID="Contenu" ContentPlaceHolderID="Contenu">
<div>
<asp:Label ID="Erreur" runat="server" Font-Bold="true" ForeColor="Red" />
</div>
<div>
<asp:DataGrid ID="DataGrid" runat="server" BorderWidth="1" GridLines="Both" AutoGenerateColumns="false">
<Columns>
<asp:BoundColumn DataField="IDOBJET" HeaderText="<%$ Resources:colonne_identifiant %>" />
<asp:BoundColumn DataField="LIBELLE" HeaderText="<%$ Resources:colonne_libelle %>" />
<asp:BoundColumn DataField="QUANTITE" HeaderText="<%$ Resources:colonne_quantite %>" ItemStyle-HorizontalAlign="Right" />
</Columns>
</asp:DataGrid>
</div>
<asp:Label runat="server" ID="Message" /><br />
<asp:Button runat="server" ID="Creation" Text="<%$ Resources:creation_fichier %>" />
</asp:Content>

Modifier le code de « liste.aspx.vb » pour ajouter la méthode suivante :

liste.aspx.vb

Private Sub Creation_Click(sender As Object, e As EventArgs) Handles Creation.Click
Dim Dossier = System.IO.Path.GetTempPath
Dim SousDossier = Dossier & "fic\"
If Not IO.Directory.Exists(SousDossier) Then
IO.Directory.CreateDirectory(SousDossier)
End If
Dim Fichier = SousDossier & "fichier.txt"
Dim Stream As IO.StreamWriter = New IO.StreamWriter(Fichier, False)
Message.Text = "Création du fichier à l'emplacement " & Fichier

Dim MyConnexion As SqlConnection = New SqlConnection("Data Source=.\SQLEXPRESS;Initial Catalog=dataDev;Integrated Security=True")
Dim MyCommand As SqlCommand = New SqlCommand("SELECT * FROM LISTECOURSES", MyConnexion)
MyConnexion.Open()
Dim MyReader As SqlDataReader = MyCommand.ExecuteReader
If MyReader.HasRows Then
Do While MyReader.Read
Stream.WriteLine(MyReader.GetInt32(0) & " - " & MyReader.GetString(1) & " : " & MyReader.GetInt32(2))
Loop
End If
MyConnexion.Close()
Stream.Close()
End Sub

Dans la méthode appelée lors du clic du bouton, on retrouve des classes du namespace « System.IO ». « Path » permet de retrouver le dossier temporaire, « Directory » de manipuler des sous-dossiers et « StreamWriter » d'écrire dans le fichier.

Cela donne le résultat suivant :

Lorsque l'on clique sur le bouton, le chemin de stockage du fichier sur le serveur apparaît.

Le fichier « fichier.txt » contient ceci :

fichier.txt

1 - Banane : 30
2 - Sucre blanc : 75
3 - Oeuf : 1
4 - Levure : 1
5 - Sel : 1
6 - Farine : 150
7 - Beurre : 70
8 - Cacao : 250

IX-B - Lecture d'un fichier texte

Dans ce chapitre, nous allons relire le fichier créé dans le chapitre précédent pour le proposer au téléchargement grâce à un bouton.

Ajouter la correspondance suivante dans « liste.aspx.resx » :

liste.aspx.resx

<data name="lecture_fichier" xml:space="preserve">
<value>Téléchargement du fichier avec la liste</value>
</data>

Modifier le code de « liste.aspx » :

liste.aspx

<%@ Page Language="vb" AutoEventWireup="false" MasterPageFile="~/Site.Master" CodeBehind="liste.aspx.vb" Inherits="DeveloppezAspNet.liste" %>

<asp:Content runat="server" ID="Titre" ContentPlaceHolderID="Titre">
<asp:Literal runat="server" Text="<%$ Resources:titre_liste_courses %>" />
</asp:Content>
<asp:Content runat="server" ID="Contenu" ContentPlaceHolderID="Contenu">
<div>
<asp:Label ID="Erreur" runat="server" Font-Bold="true" ForeColor="Red" />
</div>
<div>
<asp:DataGrid ID="DataGrid" runat="server" BorderWidth="1" GridLines="Both" AutoGenerateColumns="false">
<Columns>
<asp:BoundColumn DataField="IDOBJET" HeaderText="<%$ Resources:colonne_identifiant %>" />
<asp:BoundColumn DataField="LIBELLE" HeaderText="<%$ Resources:colonne_libelle %>" />
<asp:BoundColumn DataField="QUANTITE" HeaderText="<%$ Resources:colonne_quantite %>" ItemStyle-HorizontalAlign="Right" />
</Columns>
</asp:DataGrid>
</div>
<asp:Label runat="server" ID="Message" /><br />
<asp:Button runat="server" ID="Creation" Text="<%$ Resources:creation_fichier %>" />
<asp:Button runat="server" ID="Lecture" Text="<%$ Resources:lecture_fichier %>" />
</asp:Content>

Modifier le code de « liste.aspx.vb » pour ajouter la méthode suivante :

liste.aspx.vb

Private Sub Lecture_Click(sender As Object, e As EventArgs) Handles Lecture.Click
Dim Dossier = System.IO.Path.GetTempPath
Dim SousDossier = Dossier & "fic\"
Dim Fichier = SousDossier & "fichier.txt"
If IO.File.Exists(Fichier) Then
Dim Stream As IO.StreamReader = New IO.StreamReader(Fichier)
Dim Info As System.IO.FileInfo = New System.IO.FileInfo(Fichier)
Response.Clear()
Response.AddHeader("Content-Disposition", "attachment; filename=fichier.txt")
Response.AddHeader("Content-Length", Info.Length.ToString())
Response.ContentType = "application/octet-stream"
Dim Ligne As String = Stream.ReadLine
Do While Not Ligne Is Nothing
Response.Write(Ligne & vbCrLf)
Ligne = Stream.ReadLine
Loop
Stream.Dispose()
Stream.Close()
Response.End()
Else
Message.Text = "Le fichier " & Fichier & " n'existe pas : il faut le créer au préalable"
End If
End Sub

On retrouve des classes du namespace « System.IO ». Cette fois-ci, nous utilisons la classe « StreamReader » pour lire le fichier. L'objet implicite « Response » (il est une instance de HttpResponse, il n'est pas déclaré dans le code, mais il est utilisable) permet d'envoyer le contenu du fichier au navigateur).

Cela donne le résultat suivant :

Lorsque l'on clique sur le bouton de téléchargement, cela donne ceci :

Lorsque l'on clique sur le bouton de téléchargement après avoir créé le fichier, on obtient le résultat suivant :

X - AMÉLIORATION PAR LES AJAX CONTROLS

Dans ce chapitre, nous allons faire appel à contrôle Ajax pour bloquer la saisie de caractères alphabétiques dans le champ de « quantité ».

Faire un clic droit dans « Boîte à outils ». Puis choisir « Ajouter un onglet ».

Nommer ce nouvel onglet.

Faire un clic droit dans « Boîte à outils ». Puis choisir « Choisir les éléments… ».

Cliquer sur le bouton « Parcourir ».

Sélectionner le fichier « AjaxControlToolkit.dll » contenu dans l'archive d'Ajax Control Toolkit (décompresser l'archive au préalable).

Les nouveaux contrôles ont été ajoutés. Cliquer sur le bouton « OK ».

Modifier le code de « creation.aspx » :

creation.aspx

<%@ Page Language="vb" AutoEventWireup="false" MasterPageFile="~/Site.Master" CodeBehind="creation.aspx.vb" Inherits="DeveloppezAspNet.creation" %>

<%@ Register Assembly="AjaxControlToolkit" Namespace="AjaxControlToolkit" TagPrefix="ajax" %>

<asp:Content runat="server" ID="Titre" ContentPlaceHolderID="Titre">
<asp:Literal runat="server" Text="<%$ Resources:titre_creation_element_courses %>" />
</asp:Content>
<asp:Content runat="server" ID="Contenu" ContentPlaceHolderID="Contenu">
<ajax:ToolkitScriptManager ID="ToolkitScriptManager1" runat="server"></ajax:ToolkitScriptManager>
<div>
<table>
<tr>
<td colspan="3">
<asp:ValidationSummary runat="server" ForeColor="Red" />
</td>
</tr>
<tr>
<td>
<asp:RequiredFieldValidator runat="server" ControlToValidate="TextLibelle"
ForeColor="Red"
Display="Dynamic"
ErrorMessage="<%$ Resources:creation_libelle_erreur_obligatoire %>" >*
</asp:RequiredFieldValidator>
</td>
<td>
<asp:Label runat="server" Text="<%$ Resources:creation_element_courses_libelle_libelle %>" /> :
</td>
<td>
<asp:TextBox ID="TextLibelle" runat="server" Text="" />
</td>
</tr>
<tr>
<td>
<asp:RequiredFieldValidator runat="server" ControlToValidate="TextQuantite"
ForeColor="Red"
Display="Dynamic"
ErrorMessage="<%$ Resources:creation_quantite_erreur_obligatoire %>" >*
</asp:RequiredFieldValidator>
<asp:RegularExpressionValidator runat="server" ControlToValidate="TextQuantite"
ForeColor="Red"
Display="Dynamic"
ValidationExpression="[0-9]*"
ErrorMessage="<%$ Resources:creation_quantite_erreur_numerique %>" >*
</asp:RegularExpressionValidator>
</td>
<td>
<asp:Label runat="server" Text="<%$ Resources:creation_element_courses_libelle_quantite %>" /> :
</td>
<td>
<asp:TextBox ID="TextQuantite" runat="server" Text="" />
<ajax:FilteredTextBoxExtender ID="FiltreTextQuantite" TargetControlID="TextQuantite" FilterType="Numbers" runat="server" />
</td>
</tr>
<tr>
<td colspan="3">
<asp:Button ID="ButtonValider" runat="server" Text="<%$ Resources:creation_element_courses_libelle_valider %>" />
</td>
</tr>
</table>
</div>
<div>
<asp:Label ID="Erreur" runat="server" Font-Bold="true" ForeColor="Red" />
</div>
<div>
<asp:DataGrid ID="DataGrid" runat="server" BorderWidth="1" GridLines="Both" AutoGenerateColumns="false">
<Columns>
<asp:BoundColumn DataField="IDOBJET" HeaderText="<%$ Resources:colonne_identifiant %>" />
<asp:BoundColumn DataField="LIBELLE" HeaderText="<%$ Resources:colonne_libelle %>" />
<asp:BoundColumn DataField="QUANTITE" HeaderText="<%$ Resources:colonne_quantite %>" ItemStyle-HorizontalAlign="Right" />
</Columns>
</asp:DataGrid>
</div>
</asp:Content>

Modifier le code de « modification.aspx » :

modification.aspx

<%@ Page Language="vb" AutoEventWireup="false" MasterPageFile="~/Site.Master" CodeBehind="modification.aspx.vb" Inherits="DeveloppezAspNet.modification" %>

<%@ Register Assembly="AjaxControlToolkit" Namespace="AjaxControlToolkit" TagPrefix="ajax" %>

<asp:Content runat="server" ID="Titre" ContentPlaceHolderID="Titre">
<asp:Literal runat="server" Text="<%$ Resources:titre_modification_element_courses %>" />
</asp:Content>
<asp:Content runat="server" ID="Contenu" ContentPlaceHolderID="Contenu">
<ajax:ToolkitScriptManager ID="ToolkitScriptManager1" runat="server"></ajax:ToolkitScriptManager>
<div>
<asp:ValidationSummary runat="server" ForeColor="Red" />
</div>
<div>
<asp:DataGrid ID="DataGrid" runat="server" BorderWidth="1" GridLines="Both" AutoGenerateColumns="false">
<Columns>
<asp:BoundColumn DataField="IDOBJET" HeaderText="<%$ Resources:colonne_identifiant %>" ReadOnly="True" />
<asp:TemplateColumn HeaderText="<%$ Resources:colonne_libelle %>" >
<EditItemTemplate>
<asp:TextBox ID="textLibelle" runat="server" Text="<%# Bind('LIBELLE')%>" />
<asp:RequiredFieldValidator runat="server" ControlToValidate="textLibelle"
ForeColor="Red"
Display="Dynamic"
ErrorMessage="<%$ Resources:modification_libelle_erreur_obligatoire %>" >*
</asp:RequiredFieldValidator>
</EditItemTemplate>
<ItemTemplate>
<asp:Label ID="labelLibelle" runat="server" Text="<%# Bind('LIBELLE')%>" />
</ItemTemplate>
</asp:TemplateColumn>
<asp:TemplateColumn HeaderText="<%$ Resources:colonne_quantite %>" >
<EditItemTemplate>
<asp:TextBox ID="textQuantite" runat="server" Text="<%# Bind('QUANTITE')%>" />
<asp:RequiredFieldValidator runat="server" ControlToValidate="textQuantite"
ForeColor="Red"
Display="Dynamic"
ErrorMessage="<%$ Resources:modification_quantite_erreur_obligatoire %>" >*
</asp:RequiredFieldValidator>
<asp:RegularExpressionValidator runat="server" ControlToValidate="textQuantite"
ForeColor="Red"
Display="Dynamic"
ValidationExpression="[0-9]*"
ErrorMessage="<%$ Resources:modification_quantite_erreur_numerique %>" >*
</asp:RegularExpressionValidator>
<ajax:FilteredTextBoxExtender ID="FiltreTextQuantite" TargetControlID="textQuantite" FilterType="Numbers" runat="server" />
</EditItemTemplate>
<ItemTemplate>
<asp:Label ID="labelQuantite" runat="server" Text="<%# Bind('QUANTITE')%>" />
</ItemTemplate>
</asp:TemplateColumn>
<asp:EditCommandColumn ButtonType="PushButton"
EditText="<%$ Resources:modification_element_courses_libelle_modifier %>"
UpdateText="<%$ Resources:modification_element_courses_libelle_valider %>"
CancelText="<%$ Resources:modification_element_courses_libelle_annuler %>" />
</Columns>
</asp:DataGrid>
</div>
</asp:Content>

Dorénavant, il n'est plus possible de saisir de texte dans les champs « quantité » de la page de création et de modification.

Il est nécessaire d'ajouter la balise « ajax:ToolkitScriptManager » pour que les contrôles Ajax fonctionnent. La balise « ajax:FilteredTextBoxExtender » filtre le champ « quantité » pour que seuls les nombres soient saisissables.

Il aurait également été possible d'ajouter le tag « ToolkitScriptManager » dans la page maître « Site.Master ».

XI - CONCLUSION

Cet article ne présente pas de conseils sur l'organisation des sources d'une application. Il présente simplement quelques techniques.

Pour aller plus loin, je vous conseille de regarder du côté de MVC avec ASP.Net.

XII - REMERCIEMENTS

Je remercie très sincèrement :

- www.developpez.com qui me permet de publier cet article ;

- Nono40 et djibril pour leurs outils ;

- yahiko pour sa relecture technique ;

- Claude LELOUP pour sa relecture orthographique rigoureuse.