0% ont trouvé ce document utile (0 vote)
327 vues3 pages

Le Langage JavaScript (Formulaire)

Ce document décrit les différents contrôles de formulaire en JavaScript tels que les zones de texte, boutons radio, cases à cocher et listes de sélection. Il présente comment les créer et les manipuler à l'aide de fonctions prédéfinies.

Transféré par

Ouled Ouledelhaj
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 DOC, PDF, TXT ou lisez en ligne sur Scribd
0% ont trouvé ce document utile (0 vote)
327 vues3 pages

Le Langage JavaScript (Formulaire)

Ce document décrit les différents contrôles de formulaire en JavaScript tels que les zones de texte, boutons radio, cases à cocher et listes de sélection. Il présente comment les créer et les manipuler à l'aide de fonctions prédéfinies.

Transféré par

Ouled Ouledelhaj
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 DOC, PDF, TXT ou lisez en ligne sur Scribd
Vous êtes sur la page 1/ 3

4ème SI Le langage JavaScript

Les formulaires en JavaScript


Soit le formulaire form1 dans lequel on va créer les objets suivants :
- Le contrôle zone de texte
- Les boutons radio (option)
- Les boutons case à cocher (checkbox)
- Liste de sélection

Le contrôle zone de texte

Création
<Input type=text name=prenom value=Salah> Salah

Fonctions prédéfinies

 Document.form1.prenom.value
Rôle: Retourne le contenu de la zone de texte.
Résultat : salah

 Document.form1.prenom.value.length
Rôle: Retourne le nombre de caractères du contenu de la zone de texte
Résultat : 5

 Document.form1.prenom.value.indexOf(‘a’)
Rôle : Retourne la première position (position de 0 à length-1) d’un caractère dans la zone de
texte ou bien -1 s’il n’existe pas.
Résultat : 1

 Document.form1.prenom.value.charAt(4)
Rôle: Retourne le ième caractère de la zone de texte. i de 0 à length-1
Résultat : h

 isNaN(Document.form1.prenom.value)
Rôle: Vérifie si le contenu de la zone de texte est numérique ou non.
Résultat : true

 Number(Document.form1.prenom.value)
Rôle : Convertie le contenu de la zone de texte en nombre.

M. Amine Ben Slimène Page 1


4ème SI Le langage JavaScript

Les boutons radio (option)

Création
<input type="radio" name="choix" value="choix1"> Cours html <br>
<input type="radio" name="choix" value="choix2"> Cours javaScript <br>
<input type="radio" name="choix" value="choix3"> Cours PHP <br>

Fonctions prédéfinies
 Document.form1.choix.length
Rôle: Retourne le nombre d’options dans un groupe de cases d’options
Résultat : 3

 Document.form1.choix[1].value
Rôle: Retourne la valeur de bouton radio d’indice i. i de 0 à length-1.
Résultat : choix2

 Document.form1.choix[1].checked
Rôle: Vérifie l’état d’une case d’option (cochée ou non).
Résultat : false

Les boutons case à cocher (checkbox)

Création :
<input type="checkbox" name="check1" value="1"> Cours html <br>
<input type="checkbox" name="check2" value="2"> Cours javaScript <br>
<input type="checkbox" name="check3" value="3"> Cours PHP <br>

Fonctions prédéfinies
 Document.form1.check1.value
Rôle : Retourne la valeur d’une case à cocher.
Résultat : "1"

 Document.form1.check1.checked
Rôle: Vérifie si une case est cochée ou non.
Résultat : false

M. Amine Ben Slimène Page 2


4ème SI Le langage JavaScript

Liste de sélection

Création
<select name="nom" size=5>
<option selected> Ali </option>
<option> Mohamed </option>
<option> Salah </option>
</select>

Fonctions prédéfinies
 Document.form1.nom.length
Rôle : Retourne le nombre d’éléments dans la liste de sélection
Résultat : 3

 Document.form1.nom[2].text
Rôle : Retourne le texte du ième élément. i de 0 à length-1.
Résultat : salah

 Document.form1.nom[0].selected
Rôle : Vérifie si le ième élément (i de 0 à length-1) est sélectionné ou non.
Résultat : true.

 Document.form1.nom.selectedIndex
Rôle : Retourne l’indice de l’élément sélectionné (indice entre 0 et length -1), ou bien -1 s’il
n’y a pas d’élément sélectionné.
Résultat : 0

 Ajout d’une nouvelle option


nbrElem=document.form1.nom.length;
nouvElem= new option("khaled","kh");
Document.form1.nom.options[nbrElem]= nouvElem;

"khaled" est sauvegardé dans .text


"kh" est sauvegardé dans .value

 Suppression d’une option


Document.form1.nom.options[2]= null ;

Le i ème élément (salah) est supprimé.

M. Amine Ben Slimène Page 3

Vous aimerez peut-être aussi