Formulaires

Les formulaires sont un outil clé pour collecter les saisies des utilisateurs et les soumettre à un serveur pour traitement. Ils sont composés de différents éléments de formulaire qui permettent aux utilisateurs de saisir des données. Cependant, dans ce cours, nous n'enverrons aucune donnée à un serveur car cela nécessite des connaissances supplémentaires au-delà de la portée de ce cours.

Tous les exemples dans le code ont l'attribut onsubmit="return false". Cet attribut empêche le formulaire d'envoyer une requête au serveur par défaut.

Création de formulaires

La balise <form> est utilisée pour créer un formulaire interactif sur une page web. Elle contient divers éléments de formulaire pour la saisie de l'utilisateur.
Exemple:

html
Copier le code
Collapse
9
1
2
3
<form>
  <!-- Form elements go here -->
</form>

Éléments de formulaire

HTML fournit divers types d'entrée pour collecter les saisies de l'utilisateur. Chacun a des attributs et des comportements spécifiques. De plus, nous pouvons spécifier l'étiquette pour chaque entrée. Les étiquettes sont utilisées pour associer du texte aux éléments de saisie du formulaire, offrant une expérience plus accessible et conviviale. Nous discuterons en détail des étiquettes et des entrées dans les chapitres suivants.
Exemple:

html
Copier le code
Collapse
9
1
2
3
4
5
6
<form>
  <label for="username">Username:</label>
  <input type="text" id="username" name="username" placeholder="Your username" />
  <label for="password">Password:</label>
  <input type="password" id="password" name="password" placeholder="********" />
</form>

Soumission de formulaire

La soumission du formulaire est déclenchée par un bouton de soumission (<button type="submit">), qui peut envoyer les données du formulaire au serveur pour traitement.
Exemple:

html
Copier le code
Collapse
9
1
2
3
4
5
6
7
<form>
  <label for="username">Username:</label>
  <input type="text" id="username" name="username" placeholder="Your username" />
  <label for="password">Password:</label>
  <input type="password" id="password" name="password" placeholder="********" />
  <button type="submit">Submit</button>
</form>

Voici l'exemple de formulaire de base.

Tutoriel Vidéo