Définir la validation de la longueur en HTML

1. Utilisez l’attribut pattern pour définir la validation de la longueur en HTML
2. Utilisez l’attribut minlength pour définir la validation de longueur minimale en HTML

L’article présentera deux méthodes pour définir la validation de la longueur dans les formulaires HTML. De plus, nous discuterons de la validation des longueurs minimale et maximale.

Utilisez l’attribut pattern pour définir la validation de la longueur en HTML

L’attribut pattern définit une expression régulière dans la balise input en HTML. Il vérifiera par rapport à la valeur saisie dans le formulaire et effectuera la validation.

Nous pouvons spécifier l’expression régulière comme valeur de l’attribut pattern. Nous pouvons utiliser l’attribut pattern avec les types d’entrée tels que texte, e-mail, mot de passe, tél, URL, date et recherche.

On peut aussi utiliser l’attribut title dans la balise input pour comprendre la règle de validation. Nous pouvons spécifier le modèle de regex pour la longueur minimale et maximale.

Par exemple, créez un formulaire et écrivez une balise input avec le mot de passe type à l’intérieur.

Ensuite, utilisez l’attribut pattern pour écrire le modèle regex .{8,}. Ensuite, écrivez le texte minimum huit caractères nécessaires dans l’attribut title.

Enfin, écrivez l’attribut required dans la balise, et créez un bouton de soumission.

Ici, nous avons créé une expression régulière où la longueur minimale de l’entrée est de huit. Lorsque nous essayons de soumettre le formulaire avec une longueur de moins de huit caractères, le formulaire ne sera pas soumis.

Le message dans l’attribut title sera affiché dans une telle condition. Le . dans l’expression régulière désigne tous les caractères à l’exception de la nouvelle ligne. Nous pouvons ajouter un autre nombre après la virgule pour définir la longueur maximale.

L’attribut required empêchera la soumission du formulaire lorsqu’aucune valeur n’est fournie. Ainsi, nous pouvons définir la validation de la longueur en HTML à l’aide de l’attribut pattern.

Exemple de code :

<form action="#">
    Password<input type="password" pattern=".{8,}" title="minimum eight characters needed" required>
    <input type="submit">
</form>

Utilisez l’attribut minlength pour définir la validation de longueur minimale en HTML

HTML fournit un attribut appelé minlength pour définir la validation de longueur minimale dans le champ input. Il fonctionne dans tous les types d’entrée, tout comme l’attribut pattern.

Par exemple, créez un formulaire puis un champ de saisie pour un mot de passe. Ensuite, écrivez l’attribut minlength dans la balise input, définissez la valeur de l’attribut sur 8, et enfin, créez un bouton de soumission.

Ici, la validation de longueur fonctionne de la même manière que dans la première méthode. Lorsque nous entrons une valeur de moins de huit caractères, le formulaire ne sera pas soumis.

Nous pouvons également utiliser la propriété maxlength pour définir la longueur maximale. Ainsi, nous pouvons utiliser l’attribut minlength pour définir la validation de longueur minimale en HTML.

Exemple de code :

<form action="#">
    Password
    <input type="password" minlength="8">
    <input type="submit">
</form>