Javascript est un langage côté client, c’est-à-dire qu’il est interprété
directement par le navigateur web. L’intérêt de cette vérification est
qu’elle oblige le visiteur à corriger le champ erroné, donc le serveur
envoie uniquement des informations valides dans le programme de
traitement. C’est l’approche pour la correction d’erreurs éventuelles. Nous
n’emploierons PHP que pour des champs qui posent problème à Javascript,
comme le menu à choix multiple ou tout champ qui comprend
plusieurs éléments à sélectionner.
Nous ne verrons dans cette partie que la syntaxe Javascript utile dans le
cas d’un formulaire. Pour approfondir, nous vous donnerons les URL de
sites intéressants en annexe.
Quelques notions indispensables
La syntaxe de ce langage est légèrement différente de celle de PHP, même
si vous disposez aussi des variables, des tests, des boucles, des fonctions
(celles qui préexistent et celles que vous créez vous-même) et des objets
(thème que nous n’évoquerons pas dans ce livre).
Les fonctions
Les fonctions Javascript sont placées dans l’en-tête HTML tandis
qu’elles sont appelées à partir de la balise FORM ou d’un champ du
formulaire (y compris le bouton SUBMIT). Ce langage vérifie directement,
dans la mémoire vive du navigateur, les données entrées par
l’utilisateur. Une fonction Javascript est appelée par un événement. Dans
un formulaire, cet événement est un changement intervenu dans un champ
ou un clic sur le bouton SUBMIT. Comme dans le langage PHP, une
fonction peut en appeler une autre.
Variables et objets
Une variable doit être déclarée. Son nom n’est pas précédé d’un $.
Les objets comme les éléments d’une page web sont définis dans une
hiérarchie arborescente nommée le DOM (Document Object Model).
FORM est un de ces objets. La notation pour définir le premier champ,
nom_usage, dans la deuxième page est window.document.forms[0]
.nom_usage. Si vous n’avez qu’une fenêtre, c’est-à-dire que vous n’avez
Double Poche PHP & MySQL
pas ouvert de nouvelle fenêtre avec une fonction Javascript, vous pouvez
élider le mot window et écrire document.forms[0].nom_usage. Javascript
crée automatiquement un tableau d’objets, ainsi le même objet
nom_usage peut être défini à l’aide des tableaux et s’écrire indifféremment
:
¶ document.forms[0].nom_usage ;
¶ document.page_2.elements[0] ;
¶ document. forms[0].elements[0].
Un objet String dispose de la propriété length que nous utiliserons pour
vérifier que le champ a été rempli correctement. L’objet window contient
la méthode alert() qui permet d’afficher une fenêtre d’avertissement
avec un bouton OK. Étudions plus précisément maintenant les objets du
formulaire et leurs propriétés.