Comment valider le bouton radio à l'aide de JavaScript

Un bouton radio est un type d'élément graphique ou d'icône qui permet à l'utilisateur de sélectionner une option / choix dans un ensemble d'options. Les développeurs valident les boutons radio pour s'assurer que l'utilisateur a sélectionné une option avant de soumettre le formulaire. Supposons qu'aucune option n'est vérifiée et que vous essayez de soumettre le formulaire. Dans ce scénario, une erreur sera lancée. Il peut aider à améliorer l'expérience utilisateur en alertant l'utilisateur pour afficher les erreurs tout en soumettant des formulaires sans sélectionner l'option dans les boutons radio.

Ce message montrera la procédure pour valider les boutons radio en JavaScript.

Comment valider le bouton radio à l'aide de JavaScript?

Utilisez le "vérifié”Propriété de l'élément de bouton radio pour valider un bouton radio à l'aide de JavaScript. Il donne une valeur booléenne "vrai"Si le bouton radio est sélectionné / vérifié, s'il donne"FAUX», Cela signifie que le bouton radio est«pas vérifié".

Syntaxe

La syntaxe suivante est utilisée pour valider si le bouton radio est vérifié:

radioobject.vérifié

Exemple

Dans l'exemple suivant, nous verrons la validation du bouton radio en deux étapes:

• Créer des boutons radio sous forme
• Valider les boutons radio

Étape 1: Créer des boutons radio sous forme

Créez un formulaire avec des boutons radio qui permet de sélectionner l'option pour apprendre la langue spécifique. Fixez le «sur clic»Événement avec le bouton Soumettre qui appelle«validation()" fonction:

Sélectionnez la langue que vous souhaitez apprendre


Html

CSS

Javascrip

Nodejs

Étape 2: valider le bouton radio

Définir une fonction "validation"Cela se déclenchera sur le clic sur le bouton Soumettre pour vérifier si une option est sélectionnée ou non:

Validation de la fonction ()

Var Language = Document.former.Lang;
pour (var i = 0; i < language.length; i++)
si (langue [i].vérifié)
casser;


si (i == langue.longueur)
document de retour.getElementByid ("erreur").innerhtml = "Veuillez vérifier n'importe quel bouton radio";

document de retour.getElementByid ("erreur").innerHtml = "Option Sélectionnez" + (i + 1);

Dans l'extrait ci-dessus:

• Tout d'abord, obtenez tous les boutons radio en utilisant le nom attribué à l'aide de "former.égouter".
• Ensuite, itérez les boutons radio jusqu'à leur longueur et vérifiez si le bouton est vérifié ou non, en utilisant le "vérifié" propriété.
• Si des boutons radio sont vérifiés, cassez la boucle.
• Si aucun des boutons n'est sélectionné, affichez un message d'erreur "Veuillez vérifier n'importe quel bouton radio".

Sortir

C'est tout au sujet du bouton radio validant en javascript.

Conclusion

Pour valider le bouton radio en JavaScript, utilisez le "vérifié" propriété. Il vérifiera si le bouton est sélectionné ou non et donne une valeur booléenne dans les conditions vérifiées ou incontrôlées. Ce message a démontré la procédure de validation des boutons radio en javascript.