Balises d'entrée
Entrée de données
Bien qu'il existe de nombreuses balises pour demander des informations à un utilisateur de notre site Web, nous utiliserons le plus souvent la balise <input>. Cette balise offre une multitude d'options pour demander des informations de types différents à l'utilisateur.
Cette balise s'utilise de la façon suivante:
La valeur de l'attribut type est le format ou le type de données que nous voulons demander à l'utilisateur et l'attribut value est la valeur par défaut contenu dans l'input.
Texte
L'input de base est celui qui accepte le texte. C'est essentiellement une boîte de texte dans laquelle l'utilisateur peut entrer des données.
Nombre
L'input qui accepte des nombres. C'est essentiellement une boîte de texte qui n'accepte que des nombres et qui permet l'incrémentation et la décrémentation par des petits boutons dans l'input.
Range
L'input qui accepte un intervalle. C'est essentiellement une barre sur laquelle nous pouvons sélectionner un nombre. C'est donc une autre façon de faire entrer un nombre à notre utilisateur.
Checkbox
L'input qui est une case à cocher. Elle permet à l'utilisateur de sélectionner une option. Si plusieurs cases à cocher sont disponible, chacune d'entre elle est mutuellement exclusive et le choix d'une n'affecte pas le choix d'une autre.
Radiobutton
L'input qui donne plusieurs options à un utilisateur sous forme de case à cocher, mais qui n'accepte qu'une seule option à la fois. Bref, si vous sélectionnez une option, les autres options se décocheront automatiquement. Pour que le tout fonctionne, nous devons utiliser l'attribut name pour indiquer que les boutons radios font partie du même groupe.
Date
L'input qui permet d'entrer une date. Elle aura généralement une icône pour ouvrir un calendrier, permettant à l'utilisateur de choisir une date ou encore d'écrire la date par lui-même.
Heure
L'input qui permet d'entrer une heure. Elle aura généralement une icône pour ouvrir un menu déroulant, permettant à l'utilisateur de choisir une heure ou encore d'écrire l'heure par lui-même.
Couleur
L'input qui permet d'entrer une couleur. Elle offrira généralement un bouton pour ouvrir un sélecteur de couleur, permettant à l'utilisateur de choisir sa couleur plus facilement.
Mot de passe
L'input qui permet d'entrer un mot de passe. Elle ressemble en grande partie à un input de type texte, mais où les caractères entrés sont caché par un symbole quelconque. On l'utilise majoritairement pour entrer des mots de passe sur les sites web où nous pouvons nous connecter.
Bouton de soumission
L'input qui permet d'afficher un bouton de soumission. On l'utilisera généralement comme bouton pour soumettre un formulaire dans un site web. L'attribut value nous permet de spécifier le texte du bouton. Nous verrons comment programmer ces boutons en Javascript, dans les derniers modules du cours.
Autres inputs
Il existe une panoplie d'autres inputs disponible. Si vous voulez voir la liste complète supporté, je vous recommande de vous rendre au site web suivant: