[HTML] Les formulaires
1 août 2008 à 23:30, par ChristopheBonsoir,
J’ai remarquer que beaucoup de gens ne savent pas encore créer de formulaires en HTML et font appels à des outils automatiques…
Donc, sachez qu’un formulaire est toujours encadré par les balises <form></form> :
<form action="votre_page_de_traitement.php" method="post"> ICI, LES CHAMPS, ETC.... </form> |
L’attribut action est obligatoire dans un formulaire, method, si vous ne le spécifiez pas, la méthode est GET par défaut….
Passons aux composants des formulaires :
Les champs de textes :
<input type="text" value="valeur par défaut" name="nom_du_champ" /> |
Les champs des textes pour les mots de passes :
<input type="password" value="valeur par défaut" name="nom_du_champ" /> |
Bouton simple :
<input type="button" value="valeur par défaut" name="nom_du_bouton" /> |
Case à cocher :
<input type="checkbox" value="valeur par défaut" name="nom_du_champ" /> |
Cases à cocher, un seul choix :
<input type="radio" value="valeur par défaut" name="nom_du_champ" /> Case <input type="radio" value="valeur par défaut numero 2" name="nom_du_champ" /> Autre case |
Du coup, comme ses case portent le même nom, alors, elles seront liées…
Bouton Parcourir un fichier :
<input type="file" name="nom_du_champ" /> |
Je précise que si vous souhaitez utiliser cela, vous devez rajouter
enctype="multipart/form-data" |
en paramètre à votre balise form
Pour remettre à zéro un formulaire :
<input type="reset" value="remettre à zéro" /> |
Il n’y a pas besoin de spécifier une valeur (value) à ça…
Champ caché :
<input type="hidden" value="valeur par défaut" name="nom_du_champ" /> |
Liste de sélection :
<select name="nom_du_champ">
<option value="valeur_1">Valeur n°1</option>
<option value="valeur_2">Valeur n°2</option>
<option value="valeur_3">Valeur n°3</option>
<option value="valeur_4">Valeur n°4</option>
</select> |
Et pour finir… le bouton d’envoi final du formulaire :
<input type="submit" value="Envoyer !" name="nom_du_bouton" /> |
vous pouvez personnaliser ce bouton grâce à une image
<input type="image" src="bouton.png" name="nom_du_bouton" /> |
Voilà !
J’espère que ça va en aider bien beaucoup !
PS: demain, c’est la récupération des données