Formulaire en HTML

Un formulaire est la partie du HTML qui permet de faire interagir l'utilisateur (les liens mis à part). C'est-à-dire que grâce à un formulaire, vous pouvez envoyer des informations à un serveur web. C'est ce qui est utilisé par les moteurs de recherche afin de vous demander ce que vous voulez chercher (que ce soit google, altavista, ou le mien... c'est le même principe, enfin, uniquement pour l'aspect formulaire !).

Un formulaire est en général composé d'au moins 3 champs :

un champs FORM avec l'option ACTION qui permet de définir ce que doit faire le formulaire,

un champs de saisie ou de choix,

un bouton de validation
Mais, il y a de nombreuses possibilités pour saisir des informations dans un formulaire, que nous allons voir maintenant.

  2. Exemple de base

Nous allons juste faire un formulaire de base qui demande le nom d'une personne.

<Form Action="formulaire.php">
<Input Name="nom"><br>
<Input type="Submit" value="Envoyer">
</Form>

Ce formulaire est ce qui se fait de plus simple dans le domaine des formulaires.

Voila ce qui apparaît dans une page avec un tel code :

Déjà là, vous êtes rudement content d'avoir fait un beau formulaire...
Maintenant on va l'expliquer.

  3. Explication

La balise "<FORM>" permet de définir le début d'un formulaire. Cette balise est essentielle car elle permet de préciser le programme qui va utiliser le contenu du formulaire.
Le contenu de cette option peut aussi bien être un script PHP (ACTION="mon_script.php") qu'un script CGI (ACTION="/cgi-bin/mon_script.pl") qu'une servlet (ACTION="/servlets/moa_servlet"), soit en dernier lieu une adresse mail (ACTION="mailto:mon_adresse_mail_complete").
Il est également possible d'utiliser de l'ASP ou des JSP au même titre que du PHP, mais je n'en parlerais pas ici je pense.

Dans notre cas, le fichier qui va traiter ce formulaire s'appelle "formulaire.php", c'est à dire cette page !

La balise "<INPUT>" est elle aussi essentielle : c'est elle qui définie les champs du formulaire, c'est à dire les zones de saisie (et autre, que nous verrons plus tard). Dans notre cas, on précise juste le nom de ce champs, qui est donc "nom", et qui est donc une zone de saisie de texte (type par défaut). Ce nom de champs est arbitraire, on pourrait tout à fait mettre "prenom", "ville" ou "qjilrmeqjfl" si on le souhaite, bien que ce soit moins pratique !
Le type "submit" est essentiel aussi : c'est lui qui permet de faire apparaître le bouton d'activation du formulaire. Il est possible de se passer de ce bouton, mais dans un premier temps, nous allons l'utiliser en standard.

Voilà, vous savez faire un formulaire HTML de base. Nous allons maintenant voir les options possibles de chaque balise afin de pouvoir maîtriser cette notion très utile.

  4. Liste des balises et options

  4. 1. balise FORM

La balise FORM est donc celle qui permet l'utilisation des formulaires. Les principales options sont :

ACTION : permet de signifier le nom du programme qui va traiter les informations

METHOD : permet de définir le type d'action (POST ou GET) - Facultatif, par défaut, la valeur est GET

ENCTYPE : permet de préciser le type d'encodage (envoi de fichier par exemple) - Facultatif

  4. 2. balise INPUT

En cours...

  5. Exemple complet

En cours...

Page modifiée le : 02/10/2024