Types d'input

Dans le cours d’introduction aux formulaires, certains types d’input - les plus utilisés - ont déjà été évoqués.

Le but de ce chapitre est de montrer les autres types d’input mis à disposition des développeurs par le langage HTML.

Input Type Color

Ce type d’input est utilisé afin que l’utilisateur puisse choisir une couleur.

En fonction du navigateur utilisé et de la version de celui-ci, un sélecteur de couleur peut apparaître.

Exemple :

<input type="color" id="color" name="color">

Input Type Date

Tout bon formulaire d’inscription qui se respecte demande la date de naissance de l’utilisateur. Avant le HTML5, chaque site avait sa manière de faire sélectionner sa date de naissance à l’utilisateur, avant des champs de texte ou des listes déroulantes, par exemple.

Depuis le HTML5, il est possible de créer un champ de type date. Ce champ permet la saisie d’une date au format jj/mm/aaaa, et en fonction du navigateur utilisé et de sa version, un sélecteur de date peut être disponible.

Exemple :

<input type="date" id="naissance" name="naissance">

Les champs de type date permettent également de définir une date minimum et une date maximum sélectionnable par l’utilisateur.

Pour ce faire, les attributs min et max doivent être utilisés. Ils prennent en valeur la date minimum sélectionnable et la date maximum.

Remarque : Dans les attributs min et max, les formats de dates sont anglais, à savoir aaaa-mm-jj.

Exemple :

<!-- Date minimum possible le 01/01/1980 et maximum le 01/01/2020 -->
<input type="date" id="naissance" name="naissance" min="1980-01-01" max="2020-01-01">

Input Type Datetime-local