tp2
This commit is contained in:
parent
a8e398f198
commit
ad0030c065
100
TP/TP2/README.md
Normal file
100
TP/TP2/README.md
Normal file
@ -0,0 +1,100 @@
|
|||||||
|
# TP 2 : Intéractions avec le client. Formulaires HTML et PHP.
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
> On utilisera autant que possible les fonctions
|
||||||
|
[filter\_input](http://php.net/manual/fr/function.filter-input.php) ou
|
||||||
|
[filter\_var](http://php.net/manual/fr/function.filter-var.php) qui
|
||||||
|
permettent de valider le type (ou nettoyer) des entrées d'un formulaire
|
||||||
|
(entre autre).
|
||||||
|
|
||||||
|
### Ex1.
|
||||||
|
Ecrire le script de traitement associé au formulaire (2 champs texte
|
||||||
|
pour le nom et prénom, deux boutons radio pour choisir le sexe) qui
|
||||||
|
affiche le message bonjour Monsieur ou bonjour Madame suivi du
|
||||||
|
prénom et du nom.
|
||||||
|
|
||||||
|
<img src="./img/exo1.png" width="400">
|
||||||
|
<img src="./img/exo11.png" width="400">
|
||||||
|
|
||||||
|
Faites en sorte que la première lettre (et elle seule) du prénom et
|
||||||
|
du nom soit en en majuscule.
|
||||||
|
|
||||||
|
Vous pouvez utilisez les fonctions :
|
||||||
|
```php
|
||||||
|
string strtolower ( string $string );
|
||||||
|
string ucfirst ( string $str );
|
||||||
|
```
|
||||||
|
|
||||||
|
### Ex2.
|
||||||
|
Ecrire un (seul) script qui saisit dans un champs texte un entier et
|
||||||
|
qui affiche la table de multiplication correspondante lors de la
|
||||||
|
soumission.
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
### Ex3.
|
||||||
|
Ecrire une petite calculatrice permettant d'effectuer des
|
||||||
|
opérations arithmétiques élémentaires (+,x,-,/) sur deux opérandes.
|
||||||
|
|
||||||
|
|
||||||
|
1. Première version : affichez un formulaire permettant, dans
|
||||||
|
l'ordre, de saisir la première opérande, puis dans une liste
|
||||||
|
(`SELECT`) l'opération, enfin de saisir la deuxième opérande.
|
||||||
|
Associez à ce formulaire le script effectuant le calcul et
|
||||||
|
affichant le résultat.
|
||||||
|
2. Assurez-vous qu'on ne puisse pas diviser par 0.
|
||||||
|
3. Deuxième version : après un calcul, réaffichez le formulaire en
|
||||||
|
proposant comme valeur par défaut de la première opérande le
|
||||||
|
résultat du calcul précédent.
|
||||||
|
|
||||||
|
### Ex4.
|
||||||
|
Vous diposez du fichier html `quizz.html`. Pour chaque question, il
|
||||||
|
n'y a qu'une réponse exacte. On vous demande d'écrire le script
|
||||||
|
php de traitement des réponses qui affiche au joueur le résultat du
|
||||||
|
jeu :
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
Regardez-bien comment est structuré le quizz (nom des variables,
|
||||||
|
valeurs transmises, etc ). Cela doit vous permettre d'écrire un
|
||||||
|
script php qui s'adaptera automatiquement si on rajoute ou on
|
||||||
|
enlève des questions au quizz.
|
||||||
|
|
||||||
|
Evidemment, il est très facile de tricher !
|
||||||
|
|
||||||
|
### Ex5.
|
||||||
|
Vous disposez du formulaire suivant :
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
- Un champ texte permet de saisir un verbe du premier groupe à
|
||||||
|
conjuguer.
|
||||||
|
- Des cases à cocher permettent de choisir les temps de
|
||||||
|
conjugaisons.
|
||||||
|
|
||||||
|
Ecrire le script PHP qui receptionne les données **postées** par le
|
||||||
|
formulaire précédent, et qui affiche le verbe conjugué aux temps
|
||||||
|
choisis.
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<details>
|
||||||
|
<summary>Conseils</summary>
|
||||||
|
<div>
|
||||||
|
Pour extraire le radical, vous pouvez utiliser la
|
||||||
|
fonction [substr](http://fr2.php.net/manual/fr/function.substr.php)
|
||||||
|
|
||||||
|
```php
|
||||||
|
string substr ( string $string , int $start [, int $length ] );
|
||||||
|
```
|
||||||
|
|
||||||
|
Vous pouvez également stocker dans un tableau associatif les
|
||||||
|
terminaisons possibles, ainsi que les pronoms personnels.
|
||||||
|
|
||||||
|
```php
|
||||||
|
$terminaisons = array("present"=>array("e","es","e","ons","ez","ent"), ...
|
||||||
|
```
|
||||||
|
</div>
|
||||||
|
</details>
|
||||||
3
TP/TP2/ex1/css/style.css
Normal file
3
TP/TP2/ex1/css/style.css
Normal file
@ -0,0 +1,3 @@
|
|||||||
|
form button{
|
||||||
|
float:right;
|
||||||
|
}
|
||||||
42
TP/TP2/ex1/ex1.html
Normal file
42
TP/TP2/ex1/ex1.html
Normal file
@ -0,0 +1,42 @@
|
|||||||
|
<!DOCTYPE html>
|
||||||
|
<html lang="fr">
|
||||||
|
<head>
|
||||||
|
<meta charset="UTF-8" />
|
||||||
|
<link rel="stylesheet" href="http://www.iut-fbleau.fr/css/tacit.css">
|
||||||
|
<link rel="stylesheet" href="./css/style.css">
|
||||||
|
<title>Exercice 1</title>
|
||||||
|
|
||||||
|
</head>
|
||||||
|
<body container>
|
||||||
|
<div grid>
|
||||||
|
<div column="8 +2">
|
||||||
|
<h3> Exercice 1</h3>
|
||||||
|
<form action="ex1.php" method="POST">
|
||||||
|
<fieldset>
|
||||||
|
<legend>Qui êtes-vous ?</legend>
|
||||||
|
<!-- Text input-->
|
||||||
|
<label>Nom<br>
|
||||||
|
<input name="nom" placeholder="nom" type="text">
|
||||||
|
</label>
|
||||||
|
<!-- Text input-->
|
||||||
|
<label >Prénom<br>
|
||||||
|
<input name="prenom" placeholder="prénom" type="text">
|
||||||
|
</label>
|
||||||
|
<!-- Multiple Radios -->
|
||||||
|
<label class="control-label" for="radios">Sexe</label>
|
||||||
|
<label>
|
||||||
|
<input name="sexe" value="Homme" checked="checked" type="radio">
|
||||||
|
Homme
|
||||||
|
</label>
|
||||||
|
<label >
|
||||||
|
<input name="sexe" value="Femme" type="radio">
|
||||||
|
Femme
|
||||||
|
</label>
|
||||||
|
<!-- Button -->
|
||||||
|
<button type="submit">Envoyer</button>
|
||||||
|
</fieldset>
|
||||||
|
</form>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
14
TP/TP2/ex1/ex1.php
Normal file
14
TP/TP2/ex1/ex1.php
Normal file
@ -0,0 +1,14 @@
|
|||||||
|
<!DOCTYPE html>
|
||||||
|
<html lang="fr">
|
||||||
|
<head>
|
||||||
|
<link rel="stylesheet" href="http://www.iut-fbleau.fr/css/tacit.css">
|
||||||
|
<link rel="stylesheet" href="./css/style.css">
|
||||||
|
<meta charset="UTF-8" />
|
||||||
|
<title></title>
|
||||||
|
</head>
|
||||||
|
<body container>
|
||||||
|
<h3>
|
||||||
|
<!-- À compléter -->
|
||||||
|
</h3>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
4
TP/TP2/ex2/css/style.css
Normal file
4
TP/TP2/ex2/css/style.css
Normal file
@ -0,0 +1,4 @@
|
|||||||
|
input[type="text"]{
|
||||||
|
display:inline;
|
||||||
|
width:auto;
|
||||||
|
}
|
||||||
17
TP/TP2/ex2/multiplication.php
Normal file
17
TP/TP2/ex2/multiplication.php
Normal file
@ -0,0 +1,17 @@
|
|||||||
|
<!doctype html>
|
||||||
|
<html>
|
||||||
|
<head>
|
||||||
|
<meta charset="UTF-8" />
|
||||||
|
<link rel="stylesheet" href="http://www.iut-fbleau.fr/css/tacit.css">
|
||||||
|
<link rel="stylesheet" href="./css/style.css">
|
||||||
|
</head>
|
||||||
|
<body container>
|
||||||
|
|
||||||
|
<!-- À compléter -->
|
||||||
|
|
||||||
|
<form method="GET">
|
||||||
|
<input type=number name="table" placeholder="table">
|
||||||
|
<button type="submit">ENVOYER</button>
|
||||||
|
</form>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
34
TP/TP2/ex3/calculatrice.php
Normal file
34
TP/TP2/ex3/calculatrice.php
Normal file
@ -0,0 +1,34 @@
|
|||||||
|
<!DOCTYPE html>
|
||||||
|
<html lang="fr">
|
||||||
|
<head>
|
||||||
|
<meta charset="UTF-8" />
|
||||||
|
<title></title>
|
||||||
|
<link rel="stylesheet" href="http://www.iut-fbleau.fr/css/tacit.css">
|
||||||
|
<link rel="stylesheet" href="./css/style.css">
|
||||||
|
</head>
|
||||||
|
<body container>
|
||||||
|
<h3>Calculatrice</h3>
|
||||||
|
<form method="POST">
|
||||||
|
<!-- opérande 1 -->
|
||||||
|
|
||||||
|
<input placeholder="un nombre" type="number" step="any" name="op1" />
|
||||||
|
|
||||||
|
<!-- opération -->
|
||||||
|
|
||||||
|
<select name="operation">
|
||||||
|
<option value="+">+</option>
|
||||||
|
<option value="-">-</option>
|
||||||
|
<option value="x">x</option>
|
||||||
|
<option value="/">/</option>
|
||||||
|
</select>
|
||||||
|
|
||||||
|
<!-- opérande 2 -->
|
||||||
|
|
||||||
|
<input placeholder="un nombre" type="number" step="any" name="op2" />
|
||||||
|
|
||||||
|
<!-- bouton -->
|
||||||
|
|
||||||
|
<button type="submit" name="soumis"> Calculer</button>
|
||||||
|
</form>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
6
TP/TP2/ex3/css/style.css
Normal file
6
TP/TP2/ex3/css/style.css
Normal file
@ -0,0 +1,6 @@
|
|||||||
|
input[type="text"],
|
||||||
|
select
|
||||||
|
{
|
||||||
|
display:inline-block;
|
||||||
|
width:auto;
|
||||||
|
}
|
||||||
4
TP/TP2/ex4/css/style.css
Normal file
4
TP/TP2/ex4/css/style.css
Normal file
@ -0,0 +1,4 @@
|
|||||||
|
button{
|
||||||
|
|
||||||
|
float:right;
|
||||||
|
}
|
||||||
48
TP/TP2/ex4/quizz.html
Normal file
48
TP/TP2/ex4/quizz.html
Normal file
@ -0,0 +1,48 @@
|
|||||||
|
<!DOCTYPE html>
|
||||||
|
<html lang="fr">
|
||||||
|
<head>
|
||||||
|
<link rel="stylesheet" href="http://www.iut-fbleau.fr/css/tacit.css">
|
||||||
|
<link rel="stylesheet" href="./css/style.css">
|
||||||
|
|
||||||
|
<meta charset="UTF-8" />
|
||||||
|
<title></title>
|
||||||
|
</head>
|
||||||
|
<body container>
|
||||||
|
<h3>Quizz</h3>
|
||||||
|
<form action="score.php" method="post">
|
||||||
|
<fieldset>
|
||||||
|
<h5>Quelle est la capitale de la France ?</h5>
|
||||||
|
<label class="radio">
|
||||||
|
<input type="radio" name="question1" value="faux" > Lyon
|
||||||
|
</label>
|
||||||
|
<label class="radio">
|
||||||
|
<input type="radio" name="question1" value="vrai"> Paris
|
||||||
|
</label>
|
||||||
|
<label class="radio">
|
||||||
|
<input type="radio" name="question1" value="faux"> Marseille
|
||||||
|
</label>
|
||||||
|
<h5>Quelle est le nombre suivant de la suite 1,2,4,8 ?</h5>
|
||||||
|
<label class="radio">
|
||||||
|
<input type="radio" name="question2" value="vrai" > 16
|
||||||
|
</label>
|
||||||
|
<label class="radio">
|
||||||
|
<input type="radio" name="question2" value="faux"> 32
|
||||||
|
</label>
|
||||||
|
<h5>La bataille de Marignan a eu lieu en</h5>
|
||||||
|
<label class="radio">
|
||||||
|
<input type="radio" name="question3" value="faux" > 1492
|
||||||
|
</label>
|
||||||
|
<label class="radio">
|
||||||
|
<input type="radio" name="question3" value="vrai"> 1515
|
||||||
|
</label>
|
||||||
|
<label class="radio">
|
||||||
|
<input type="radio" name="question3" value="faux"> 1789
|
||||||
|
</label>
|
||||||
|
|
||||||
|
<button type="submit">Envoyer</button>
|
||||||
|
|
||||||
|
<input type="hidden" value="3" name="nbq">
|
||||||
|
</fieldset>
|
||||||
|
</form>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
16
TP/TP2/ex4/score.php
Normal file
16
TP/TP2/ex4/score.php
Normal file
@ -0,0 +1,16 @@
|
|||||||
|
<!DOCTYPE html>
|
||||||
|
<html lang="en">
|
||||||
|
<head>
|
||||||
|
<link rel="stylesheet" href="http://www.iut-fbleau.fr/css/tacit.css">
|
||||||
|
|
||||||
|
<link rel="stylesheet" href="./css/style.css">
|
||||||
|
|
||||||
|
<meta charset="UTF-8" />
|
||||||
|
<title></title>
|
||||||
|
</head>
|
||||||
|
<body container>
|
||||||
|
<h4>Réponses</h4>
|
||||||
|
<ul>
|
||||||
|
</ul>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
24
TP/TP2/ex5/conjuguer.php
Normal file
24
TP/TP2/ex5/conjuguer.php
Normal file
@ -0,0 +1,24 @@
|
|||||||
|
<?php
|
||||||
|
$terminaisons = array(
|
||||||
|
"present" => array("e","es","e","ons","ez","ent"),
|
||||||
|
"futur" => array("erai","eras","era","erons","erez","eront"),
|
||||||
|
"imparfait" => array("ais","ais","ait","ions","iez","aient")
|
||||||
|
);
|
||||||
|
$pronoms=array("je","tu","il","nous","vous","ils");
|
||||||
|
if (isset($_POST['verbe'])) $verbe = $_POST['verbe'];
|
||||||
|
?>
|
||||||
|
|
||||||
|
<!DOCTYPE html>
|
||||||
|
<html lang="en">
|
||||||
|
<head>
|
||||||
|
<meta charset="UTF-8" />
|
||||||
|
<link rel="stylesheet" href="http://www.iut-fbleau.fr/css/tacit.css">
|
||||||
|
|
||||||
|
<link rel="stylesheet" href="./css/style.css">
|
||||||
|
|
||||||
|
<title></title>
|
||||||
|
</head>
|
||||||
|
<body container>
|
||||||
|
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
4
TP/TP2/ex5/css/style.css
Normal file
4
TP/TP2/ex5/css/style.css
Normal file
@ -0,0 +1,4 @@
|
|||||||
|
input[type="text"]{
|
||||||
|
width:auto;
|
||||||
|
|
||||||
|
}
|
||||||
24
TP/TP2/ex5/ex5.html
Normal file
24
TP/TP2/ex5/ex5.html
Normal file
@ -0,0 +1,24 @@
|
|||||||
|
<!doctype html>
|
||||||
|
<html>
|
||||||
|
<head>
|
||||||
|
<meta charset="UTF-8" />
|
||||||
|
|
||||||
|
<link rel="stylesheet" href="http://www.iut-fbleau.fr/css/tacit.css">
|
||||||
|
<link rel="stylesheet" href="./css/style.css">
|
||||||
|
</head>
|
||||||
|
|
||||||
|
<body container>
|
||||||
|
<h3>Conjugaison</h3>
|
||||||
|
<form method="post" action="conjuguer.php" class="form-horizontal">
|
||||||
|
<fieldset>
|
||||||
|
<label class="control-label">Verbe du premier groupe</label>
|
||||||
|
<input type=text name="verbe" >
|
||||||
|
<label>Temps</label>
|
||||||
|
<label class="checkbox"><input type=checkbox name="temps[]" value="present"> Présent </label>
|
||||||
|
<label class="checkbox"><input type=checkbox name="temps[]" value="futur"> Futur </label>
|
||||||
|
<label class="checkbox"><input type=checkbox name="temps[]" value="imparfait"> Imparfait </label>
|
||||||
|
<button type="submit" name="accepter">Envoyer</button>
|
||||||
|
</fieldset>
|
||||||
|
</form>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
BIN
TP/TP2/img/ex2.png
Normal file
BIN
TP/TP2/img/ex2.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 32 KiB |
BIN
TP/TP2/img/ex3.png
Normal file
BIN
TP/TP2/img/ex3.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 21 KiB |
BIN
TP/TP2/img/ex4.png
Normal file
BIN
TP/TP2/img/ex4.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 34 KiB |
BIN
TP/TP2/img/ex41.png
Normal file
BIN
TP/TP2/img/ex41.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 30 KiB |
BIN
TP/TP2/img/ex5.png
Normal file
BIN
TP/TP2/img/ex5.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 28 KiB |
BIN
TP/TP2/img/ex51.png
Normal file
BIN
TP/TP2/img/ex51.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 36 KiB |
BIN
TP/TP2/img/exo1.png
Normal file
BIN
TP/TP2/img/exo1.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 26 KiB |
BIN
TP/TP2/img/exo11.png
Normal file
BIN
TP/TP2/img/exo11.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 20 KiB |
Loading…
Reference in New Issue
Block a user