:::Les Formulaires :::

c'est quoi un formulaire ?

-Le formulaire HTML va vous permettre de récupérer des informations que va saisir l'internaute sur votre site.

L'internaute va saisir ses informations soit en remplissant des champs texte (input), soit sélectionnant un élément dans une liste déroulante (select) ou en sélectionnant une case à cocher (radio, checkbox).
Une fois les informations saisies, l'internaute va valider en cliquant sur un bouton de soumission (submit).

Alors les informations seront transmises soit à une adresse e-mail (mailto) soit à un cgi (Common Gateway Interface), soit à une page dynamique de type php, asp, jsp...

La balise form :

Un formulaire HTML se définit par la balise HTML <FORM> </FORM>.
La balise HTML <FORM> doit contenir deux attributs indispensables.
- ACTION qui définit la destination où sont envoyées les donnés, en règle générale c'est une page dynamique type html ou php ou bien asp...
- METHOD qui définit la méthode d'envoi (POST et GET).
exemple:

Code:

<FORM method="post" action="cgi-bin/script.php">.....</form>

Une balise <FORM> ne doit pas contenir une autre balise <FORM>.
Une page HTML peut contenir plusieurs formulaires.

Mailto :
Nous allons étudier dans ce chapitre l'attribut METHOD de type "post" et l'attribut ACTION de type "mailto: Votre e-mail".
Nous l'écrirons :

Code:

<FORM ACTION="mailto:Votremail" METHOD="post" ENCTYPE="text/plain">

ENCTYPE précise la méthode MINE de codification (format d'envoi) qui va être utilisé pour l'envoi en METHOD="POST".
"Text/plain" est la valeur qui doit être utilisé lorsque les informations sont envoyées par courrier électronique, ce qui est le cas car l'action est de type "mailto:Votremail".
Lorsque vous recevez le formulaire (avec cette méthode et cette action), il sera sous cette forme :

Code:

prenom=owenho
nom=vinci
activite=modérateur

En fait, le premier mot est en général associé à l'attribut name d'une balise et le second après le = est la valeur attribuée à value de cette même balise. Il y a des exceptions que nous verrons lorsque nous étudierons la balise.
La valeur de NAME doit être la plus significative de l'information que vous demandez, la valeur ne doit pas comporter d'accent ni de virgule.

Effacer et envoyer :
Dans un formulaire vous devez avoir obligatoirement deux boutons.
Un bouton pour réinitialiser le formulaire :

Code:

<INPUT type="reset" name="nom" value="Rétablir">

Un bouton pour envoyer le formulaire :

Code:

<INPUT type="submit" name="nom" value="Envoyer">

Value correspond au texte affiché sur le boutton.
Type définit pour ces deux boutons l'action à exécuter :
- reset pour réinitialiser
- submit pour envoyer.

Les champs de texte :
Il existe deux types de champs de texte :
- le champ simple d'une ligne,
- le champ multi-lignes.

simple :

Code:

<INPUT type="text" name="nom" value="" size="5">

Type définit la forme de la balise <INPUT>, donc pour une zone de texte simple c'est "text".
Name donne un nom au champ texte. Très important car à ce nom est associé la valeur.
Value définit le texte mis au départ dans le champ, si le champ est vide alors value="". sachez que si vous rentrez une valeur par défaut, l'internaute sera obligé de sélectionner le texte de votre champ texte puis de l'effacer pour pouvoir écrire un nouveau texte (sauf si vous utilisez le javascript).
Size correspond à la longueur du champ, ce n'est pas des pixels, je dirais que cela correspond à l'encombrement total horizontal de la lettre la plus large (w).
Multi-lignes:

Code:

<TEXTAREA name="nom" cols="30" rows="5">Texte défaut</TEXTAREA>

COLS correspond à la longueur du champ, ce n'est pas des pixels, je dirais que cela correspond à l'encombrement total horizontal de la lettre la plus large (w).
ROWS correspond à la hauteur du champ c'est à dire le nombre de ligne.

Les cases à cocher :
La case à cocher s'écrit :

Code:

<INPUT type="checkbox" name="nom" value="Nom_du_choix">

Type définit la forme de la balise <INPUT>, donc pour une case à cocher, c'est "checkbox".
Name donne un nom à la case. Très important car à ce nom est associé à la valeur (value) lorsque l'on réceptionne le formulaire.
Value est la valeur de la sélection.
Les boutons radio :
Le bouton radio s'écrit :

Code:

<INPUT type="radio" name="nom" value="Nom_du_choix">

Type définit la forme de la balise <INPUT>, donc pour un bouton radio, c'est "radio".
Name donne un nom. Très important car à ce nom est associé une valeur qui est en faite le texte saisit par l'internaute.
Pour faire un seul choix dans un ensemble de propositions, le nom doit être identique.
Value c'est la valeur de la sélection.

choix sous forme d'un select :

Code:

<SELECT name="Nom_de_la_selection" size="1" multiple>
  <OPTION value="choix">Premier_choix</option>
</SELECT>

Name est le nom de la sélection, il est associé à la valeur de la balise <OPTION>.
Size détermine le nombre d'options visibles. Il doit être < ou = au nombre de balises <OPTION>.
Multiple signifie que l'on peut faire plusieurs sélections. si vous ne le mettez pas, l'internaute ne pourra faire qu'une sélection.

La balise <OPTION> correspond à un élément de la liste.
Vous pouvez donc avoir plusieures balises <OPTION>
Tous ce qui sera entre <OPTION> et </OPTION> sera visible par l'internaute.
Value est la valeur renvoyée dans le formulaire, elle sera associée Name de la balise <SELECT>.

enfin voiçi un formulaire complet qui contient tous .
bon courage .