Scribd
Importer
152 vues2 pages

TP HTML 5 CSS3 JavaScript

Transféré par

Sarra Chtourou
Copyright
© © All Rights Reserved
Nous prenons très au sérieux les droits relatifs au contenu. Si vous pensez qu’il s’agit de votre contenu, signalez une atteinte au droit d’auteur ici.
Formats disponibles
Téléchargez aux formats PDF, TXT ou lisez en ligne sur Scribd
152 vues2 pages

TP HTML 5 CSS3 JavaScript

Transféré par

Sarra Chtourou
Copyright
© © All Rights Reserved
Nous prenons très au sérieux les droits relatifs au contenu. Si vous pensez qu’il s’agit de votre contenu, signalez une atteinte au droit d’auteur ici.
Formats disponibles
Téléchargez aux formats PDF, TXT ou lisez en ligne sur Scribd
Vous êtes sur la page 1/ 2

Module 2 : Systèmes, technologies et Internet JavaScript

JavaScript

Le travail consiste à ajouter quelques contrôles de saisie pour les pages « enregistrement.html » et « evaluation.html »
de Tp précédent en y intégrant des script JavaScript externe .
Pour cela nous allons ajouter des évènements relier à des cliques sur les boutons
�Nb : Toutes les fonctions JavaScript devront être créées dans un fichier intitulé « controle.js ».

Travail demandé

� Le clique sur le bouton « Ajouter » fait appel à une fonction


JavaScript intitulée «verif1 » qui vérifie les champs ci-dessous � Document HTML « enregistrement.html »
<!--Ajouter le lien pour le fichier javascript-->
<head><script src="controle.js"></script></head>
<!—Ajouter des id pour les champs a contrôlées -->
<input type="text" name="" id="permis»/>
<input type="text" name="" id="nom" />
<input type="text" name="" id="prenom" />
<input type="radio" name="genre" id="homme" /><label class="rad">
Femme</label>
<input type="radio" name="genre" id="femme"/> <label
class="rad">Homme</label>
Champ Contrôle <!—Appel de la fonction verif1() avec l’évènement
onclick pour le bouton Ajouter -->
 N° Permis Une chaîne de 8 caractères respectant le format suivant :
xx/xxxxx <input type="submit" class="bt" value="Ajouter"
onclick="return verif1();" />
 Nom Une chaîne alphabétique de longueur entre 3 et 20.
� Fichier JavaScript « controle.js »
//Fonction pour tester si une chaine est
 Prénom Une chaîne alphabétique de longueur entre 3 et 20.
//formée uniquement par des lettres, retourne booléen
La sélection d’un genre est obligatoire.
 Genre function alpha(chaine){ .............. }
//Fonction pour tester si une chaine
� Le clique sur le bouton « Valider » fait appel à une fonction //est formée uniquement par des chiffres,retourne booléen
JavaScript intitulée «verif2 » qui vérifie les champs ci-dessous function numerique(chaine){ ......... }
function verif1()
{
//Obtenir les valeur des champs
permis=document.getElementById('permis').value
nom=document.getElementById('nom').value
prenom=document.getElementById('prenom').value
//Construire une chaine a partir du permis sans '/'
ch=permis.substr(0,2)+permis.substr(3,(permis.length)-1) if
((permis.length != 8) || (permis.indexOf("/")!= 2)||
!(numerique(ch)))
{
//Message d'erreur a l'aide de la boite de dialogue alert("Permis
invalide longeur doit etre 8 et format
xx/xxxxx ") return
false}
Champ Contrôle if ((!alpha(nom)||(nom.length<|| nom.length > 20))) {
Le même contrôle cité précédemment. alert("Nom invalide ")
 N° Permis
return false}
 Modèle testé La sélection d’un modèle est obligatoire.
if (!alpha(prenom)||(prenom.length<3||prenom.length>20)){
 Sécurité Un entier entre 1 et 5. alert("Prenom invalide") return
false}
 Conduite Un entier entre 1 et 5.
genre=document.getElementById('femme').checked ||
 Confort Un entier entre 1 et 5. (document.getElementById('homme').checked) if(!genre)
{ alert("Vous devez choisir le genre ") return
 Je ne suis pas un robot La sélection de case à cocher est obligatoire false}
}

1
//fonction pour tester si une chaine est forme uniquement par des lettres
function alpha(ch)
{
//Mettre en majuscule la chaine chaine=ch.toUpperCase()
i=0
while ((i<chaine.length)&& (chaine.charAt(i)>="A"&& chaine.charAt(i)<="Z"))
{i++}
return i==chaine.length
}
//fonction pour tester si une chaine est formé uniquement par des chiffres
function numerique(chaine)
{
i=0
while ((i<chaine.length)&& ((chaine.charAt(i)>="0"&&
chaine.charAt(i)<="9")))
{ i++ }
return i==(chaine.length)
}
function verif1()
{
//Obtenir les valeur des champs
permis=document.getElementById('permis').value
nom=document.getElementById('nom').value
prenom=document.getElementById('prenom').value

//Construire une chaine a partir du champs permis sans '/'


ch=permis.substr(0,2)+permis.substr(3,(permis.length)-1)
if ((permis.length != 8) || (permis.indexOf("/")!= 2)|| !(numerique(ch)))
{
//Message d'erreur a l'aide du boite de dialogue
alert("Permis invalide longeur doit etre 8 et format xx/xxxxx ") return
false
}

if ((!alpha(nom) ||(nom.length < 3 || nom.length > 20) )) {


alert("Nom invalide ")
return false
}
if (!alpha(prenom)||(prenom.length < 3 || prenom.length > 20)){
alert("Prenom invalide")
return false
}
genre=document.getElementById('femme').checked || (document.getElementById('homme').checked) if(!genre)
{
alert("Vous devez choisir le genre ") return
false
}
}
2

Vous aimerez peut-être aussi