docExercice sur les formulaires HTML - EBSI
download 
Plainte Transcription
Exercice sur les formulaires HTML - EBSI
Formulaire HTML – Exercice
1/2
Université de Montréal, EBSI
SCI6306 – Bases de données documentaires
Automne 2016
EXERCICE : FORMULAIRE HTML
Contexte général
Vous voulez créer un formulaire Web recueillant quelques informations personnelles et générant
automatiquement, à partir de ces dernières, un texte de présentation. Vous aurez ainsi à créer deux
fichiers, avec Notepad++, en suivant les directives ci-dessous.
1. Formulaire (info.htm) 1
Votre formulaire devra contenir les éléments suivants :
•
•
•
•
Une boîte pour saisir le prénom
Une liste déroulante pour connaître le sexe de la personne (Homme, Femme)
Une boîte pour saisir l’année de naissance
Une boîte pour saisir un proverbe ou une citation
Inscrivez-y les instructions nécessaires pour valider que toutes les informations ont été fournies ainsi que
pour vous assurer que l’année de naissance est bien un nombre.
Finalement, incluez-y un bouton afin de soumettre le formulaire et se retrouver sur la page du texte de
présentation (presentation.php). Votre formulaire utilisera la méthode POST.
2. Page de présentation (presentation.php)
À partir des informations fournies, créez le code pour répliquer le texte suivant (les éléments dynamiques
sont en grisés) :
Bonjour,
Permettez-moi de vous présenter prénom. Bien que n’ayant que âge ans,
il/elle est déjà d’une grande sagesse, comme le montre sa maxime
préférée : proverbe!
Le truc ici est de commencer par préparer les balises HTML pour le contenu statique, c’est-à-dire ce qui
ne vient pas des contrôles du formulaire. Une fois ces balises saisies, il ne reste qu’à y insérer le code
PHP pour faire afficher les valeurs des contrôles ou le résultat de certains traitements sur ces dernières.
Quelques pistes/rappels :
1
•
Pour insérer du code PHP, il faut l’inclure entre les balises <?php et ?>.
•
Pour faire afficher quelque chose à l’écran, il faut utiliser la commande PHP echo.
•
Chaque commande en PHP se termine par un point-virgule.
•
Pour faire référence au contenu d’un contrôle, en PHP, il faut utiliser la commande
$_POST['nom_du_contrôle']. Par exemple, si votre contrôle s’appelle « prenom », la commande
pour le faire afficher sera <?php echo $_POST['prenom']; ?>
•
La commande date('Y') permet de connaître l’année en cours et ainsi de déduire l’âge.
Rappel : La structure générique d’une page HTML5 est la suivante :
<!DOCTYPE html>
<html>
<head>
<title></title>
</head>
<body>
</body>
</html>
SCI6306 (Automne 2016)
Professeure : Christine Dufour
Copyright © 2016 Christine DUFOUR
Formulaire HTML – Exercice
•
2/2
Il est possible de faire un affichage conditionnel à la valeur d’un contrôle, c’est-à-dire d’afficher un
contenu différent selon sa valeur. Par exemple, imaginez que vous ayez un contrôle nommé
« chocolaphile » qui accepte la valeur Oui ou Non. La commande suivante :
<?php echo ($_POST['chocolaphile']=="Oui"?"Comme je vous comprends!":"Ça
en fera plus pour moi…");?>
permettra d’afficher « Comme je vous comprends! » si la personne aime le chocolat ou « Ça en
fera plus pour moi… » si ce n’est pas le cas. C’est une logique similaire à celle de la commande
IF en SQL, seule la syntaxe change.
La syntaxe générique pour une condition est la suivante :
(condition?élément à afficher si oui:élément à afficher si non)
Tests du formulaire
Une fois que vous aurez modifié les deux fichiers, déposez-les sur le serveur GIN-EBSI et accédez-y à
partir d’un navigateur en utilisant l’adresse absolue du fichier (par exemple : http://www.ginebsi.umontreal.ca/sci6306a16-eq04/info.htm). Testez-les pour vous assurer que tout fonctionne.
Assurez-vous aussi qu’ils soient valides en utilisant le validateur du W3C (https://validator.w3.org/).
Pour avoir accès à votre espace d’équipe sur GIN-EBSI, il vous faudra créer un lecteur réseau. Vous
trouverez des explications détaillées à l’URL http://www.gin-ebsi.umontreal.ca/ (section Accéder à mon
espace). En résumé, voici comment faire sur un poste dans les laboratoires de l’EBSI :
1. Ouvrez Ce PC.
2. Dans l’onglet Ordinateur, cliquez sur Connecter un lecteur réseau > Connecter un
lecteur réseau
3. Dans la fenêtre qui s’ouvre, indiquez le chemin pour le lecteur réseau : \\ginebsi\usagers\sci6306a16-eqxx (où xx est votre numéro d’équipe).
4. Cliquez sur Terminer.
5. Vous devriez maintenant voir apparaître, dans la fenêtre de Ce PC, section Emplacements
réseau, votre espace d’équipe.
SCI6306 (Automne 2016)
Professeure : Christine Dufour
Copyright © 2016 Christine DUFOUR
