Les formulaires - Cours Javascript

Introduction

Info

Nous allons étudier les propriétés Javascript de la balise HTML et XHTML <FORM>.
La balise HTML et XHTML FORM est invisible, elle vous permet de délimiter votre formulaire et de l'identifier.
La gestion des formulaires est très facile.
Chaque balise du formulaire doit posséder l'attribut HTML et XHTML name="UnNom" pour être identifiée ou id="UnNom" si vous êtes en XHTML.

Vous trouverez d'autres informations pour compléter ce cours dans le chapitre :
- L'objet javascript Form du Document Object Model HTML (DOM HTML).
- la balise HTML XHTML FORM
- les feuilles de style CSS

Form

Balise HTML et XHTML

HTML :
Exemple de code :
<form name="dmc"></form>

XHTML :
Exemple de code :
<form id="dmc"></form>

document.forms

Info

L'objet javascript document.forms
document.forms.NomDuformulaire est la première chose a déterminer.

Cette première partie permet de spécifier dans quel formulaire de votre page HTML ou XHTML (si vous en avez plusieurs), on va intervenir.

Par exemple :
Votre formulaire doit être de la forme :
Exemple de code :
<form name="dmc">
</form>

la commande Javascript pour atteindre le formulaire sera :
Exemple de code :
document.forms.NomDuformulaire

Ensuite vient le nom de la balise a atteindre dans ce formulaire :
Exemple de code :
document.forms.NomDuformulaire.NomBalise


Par exemple :
Votre formulaire doit être de la forme :
Exemple de code :
<form name="dmc">
<input type="text" value="DMC" name="nom">
</form>

la commande Javascript pour atteindre les divers éléments du formulaire sera :
Exemple de code :
document.forms.dmc.nom


En final, vient s'ajouter la propriété de la balise que l'on veut modifier.

Par exemple :
Votre formulaire doit être de la forme :
Exemple de code :
<form name="dmc">
<input type="text" value="DMC" name="nom">
</form>

Nous voulons changer la valeur de nom qui est "dmc" en "cmd".

la commande Javascript pour atteindre les divers éléments du formulaire sera :
Exemple de code :
document.forms.dmc.nom.value="cmd";

Nous étudierons plus loin les propriétés Javascript de chaque balise HTML et XHTML des formulaires.
Sélectionnez la balise qui vous intéresse, et cliquez sur "Go!".

forms.action

Info

La propriété javascript action de l'objet document.forms permet de connaître ou de modifier la valeur de l'attribut HTML et XHTML action de la balise HTML ou XHTML FORM.
Exemple de code :
<form name="dmc" action="aliasdmc.php">
<input type="text" value="DMC" name="nom">
</form>

La propriété javascript action de l'objet document.forms accepte comme valeur :
- url relative ou absolue.
Exemple de code :
document.forms.dmc.action="dmc.php";

La propriété javascript action de l'objet document.forms renvoie comme valeur :
- valeur de type String.
Exemple de code :
alert(document.forms.dmc.action);
//dmc.php

forms.encoding

Info

La propriété javascript encoding de l'objet document.forms permet de connaître ou de modifier la valeur de l'attribut HTML ou XHTML enctype de la balise HTML ou XHTML FORM.
Exemple de code :
<form name = "dmc" enctype = "text/richtext">
<input type="text" value="DMC" name="nom">
</form>

La propriété javascript enctype de l'objet document.forms accepte comme valeur :
- valeur de type String qui correspond à type Mine.
Exemple de code :
document.forms.dmc.encoding="text/plain";

La propriété javascript enctype de l'objet document.forms renvoie comme valeur :
- valeur de type String.
Exemple de code :
alert(document.forms.dmc.encoding);

forms.target

Info

La propriété javascript target de l'objet document.forms permet de connaître ou de modifier la valeur de l'attribut HTML et XHTML target de la balise HTML ou XHTML FORM.
Exemple de code :
<form name="dmc" target="dmc">
</form>

La propriété javascript target de l'objet document.forms accepte comme valeur :
- valeur de type String.
Exemple de code :
document.forms.dmc.target="_blank";

La propriété javascript target de l'objet document.forms renvoie comme valeur :
- valeur de type String.
Exemple de code :
alert(document.forms.dmc.target);