Explorer le système

Pour commencer

Accédez aux outils et aux éléments de base qui permettent de concevoir et de mettre au point des expériences cohérentes et accessibles.

Développer Conception

Champs obligatoires

Comment indiquer un champ obligatoire.

Conseils

L’application d’une validation de base permet d’améliorer l’exactitude des données saisies par l’utilisateur.

Cette validation de base des champs obligatoires peut être utilisée plusieurs fois dans une même page. Le message d’erreur se trouve dans le code HTML.

L’astérisque seul n’est pas suffisant pour garantir une expérience accessible; nous ajoutons également un texte visuellement caché pour les lecteurs d’écran qui dit « obligatoire ». Nous ajoutons aussi obligatoire à l’élément de saisie HTML.

Vous devrez inclure gnb-forms-validation-1.0.0.js pour utiliser cette composant.

HTML

<!-- Champ obligatoire de base avec validation -->
<div class="gnb-form-input">
<label for="field-name">Champ obligatore<span class="required">*</span><span
		class="sr-only">obligatoire</span></label>
<input id="field-name" name="field-name" type="text" class="gnb-address-field required-field"
	required>
<div class="gnb-form-validation required-error" style="display: none;">
	Ce champ est obligatoire.
</div>
</div>