TUTORIELS 

Découverte pratique de Visual Studio.NET

Laboratoire 6 : Application basée sur le navigateur
(Fourni par MSDN France)

Utiliser un formulaire pour créer pas à pas une application web de bienvenue. Avant-dernier volet de la série consacrée à Visual Studio .NET.  (24 avril 2002)
 

Introduction
Dans cet exercice pratique, vous allez utiliser un formulaire Web pour créer pas à pas une application Web de bienvenue.

Création d'une application Web de bienvenue
- Cliquez sur Démarrer, Programmes, Microsoft Visual Studio .NET, puis sur Microsoft Visual Studio .NET. La page de démarrage est illustrée dans la figure 1.



figure 1. Page de démarrage de l'IDE Visual Studio .NET

- Cliquez sur New Project. La fenêtre New Project s'affiche (figure 2).



figure 2. Fenêtre New Project

- Dans le volet Project Types, cliquez sur Visual Basic Projects, et dans le volet Templates, cliquez sur ASP .NET Web Application. Conservez les valeurs par défaut des champs Name (WebApplication1) et Location (http://<SERVER>).
- Cliquez sur OK. Une grille vierge de conception de formulaire Web intitulée « WebForm1.aspx » apparaît, comme dans la figure 3.



figure 3. Grille vierge de conception de formulaire Web

- Dans le menu View, cliquez sur Toolbox (ou sur l'icône de la boîte à outils).

À l'aide du menu Toolbox, créez votre formulaire Web. Le menu Toolbox affiche la liste des commandes disponibles dans les formulaires Web.

- Dans le menu Toolbox, cliquez et faites glisser une étiquette (Label) en haut et à gauche de la grille de conception WebForm1.aspx.
- Dans le menu Toolbox, cliquez et faites glisser une boîte de texte (TextBox) à droite de l'étiquette que vous avez placée à l'étape 2.
- Dans le menu Toolbox, cliquez et faites glisser un bouton (Button) à droite de la boîte de texte que vous avez placée à l'étape 3.
- Dans le menu Toolbox, cliquez et faites glisser une autre boîte de texte (TextBox) et placez-la sous la première boîte de texte placée à l'étape 3. Votre formulaire Web doit ressembler à celui de la figure 4.



figure 4. Grille de conception du formulaire Web contenant des objets

Édition d'un formulaire Web
À présent, vous allez éditer les objets que vous avez fait glisser dans votre formulaire (WebForm1.aspx). Vous utiliserez la zone Properties en bas et à droite de la page pour éditer les propriétés de l'étiquette et du bouton. Vous ajouterez également une procédure au bouton.

- Dans le formulaire, cliquez sur Label.
- Dans la zone Properties, modifiez le champ de texte de « Label » pour « Enter Name: ».
- Dans le formulaire, cliquez sur Button.
- Dans la zone Properties, modifiez le champ de texte de « Button » pour « OK ».
- Dans le formulaire, double-cliquez sur le bouton OK que vous venez de créer. Le code source de WebForm1.aspx.vb apparaît avec deux procédures : Page_Init et Button1_Click. Dans cet exercice, vous ne modifierez que la procédure Button1_Click.

Avertissement : N'éditez pas la procédure Page_Init car elle est utilisée par le générateur de formulaires.

- Insérez le code suivant sous la procédure Button1_Click :

If TextBox1().Text <> "" Then
  TextBox2().Text = "Hello " & TextBox1().Text & "!"
End If


Lorsque ce code a été saisi, l'application peut être exécutée.

Remarque : Du fait qu'il s'agit d'une version bêta 2 de Visual Studio .NET, l'application peut demander un temps de chargement plus long que prévu. Ceci vient du fait qu'un code important de débogage doit être parcouru.

- Appuyez sur F5.
L'application se compile et s'affiche dans une nouvelle fenêtre du navigateur comme illustré à la figure 5.

figure 5. Vue par le navigateur du formulaire Web

- Dans la zone de texte du haut, entrez un nom tel que « John ».
- Cliquez sur OK. Le formulaire Web édité est illustré dans la figure 6.

figure 6. Résultat du formulaire Web


Fin du laboratoire 6
Suivez la procédure ci-après pour fermer l'application.
- Pour fermer Internet Explorer, cliquez sur Fichier, puis sur Fermer.
- Pour fermer l'IDE, cliquez sur File, puis sur Exit.

Initialement publié sur MSDN France le 18 janvier 2002

 
[ MSDN France pour JDNet
 
Accueil | Haut de page