Javascript -> vérifier bouton radio coché

Par just_real, il y a 4 ans

Les bases HTML/CSS
Javascript

Bonjour, j'ai une liste de 27 boutons radios (choix unique donc) et je dois vérifier en JS si au moins une case est cochée
J'arrive à selectionner et vérifier un des boutons sans pb

if (document.querySelector('#idradio_'+[value = '0']).checked != true) { alert("test") } else if (etc ....

du coup j'aimerais qu'à la place de value = '0' cela vérifie directement sur toutes les valeurs comprises entre 0 et 27 inclu.
merci pour votre aide

7 réponses

LoupBlanc, il y a 4 ans

Si tu faitsune boucle for qui va parcourir tous les boutons de 0 à 27 et que tu fais un arrêt dés que tu trouve une case coché cela devrait résoudre ton problème ?

var i; for (i = 0; i < 27; i++) { if document.querySelector( xxx == true) { alert("test") break; } }
just_real, il y a 4 ans

oui j'ai essayé dans l'après midi avec des boucles mais je dois faire des erreur de syntaxe car je n'y arrive pas

just_real, il y a 4 ans

je viens d'essayer comme ça mais ça marche pas

var i; for (i = 0; i < 27; i++) { if (document.querySelector('#idradio_'+i).checked != true) { alert("test") break; } }
popotte, il y a 4 ans

Avec un state?
d'abord les radio sont considérées comme aucun checkée
ensuite on passe un listenner sur toutes les radios, au change on lance la fonction pour vérifier si au moins une radio est checkée (pas sur que l'event soit change par contre ^^')
en début de controle on repasse le check à false et si une radio est checkée on repasse le check a true sinon on laisse comme ça

let hasOneRadioChecked = false function checkRadios() { document.querySelectorAll('.radios').map(radio => { hasOneRadioChecked = false if (radio.checked) { hasOneRadioChecked = true break } }) } document.querySelectorAll('.radios').map(radio => { radio.addEventListenner('change', checkRadios) })
just_real, il y a 4 ans

merci popote je vais tester ça !

MickaelTD, il y a 4 ans

Hello, tu peux le faire comme ceci aussi

const checkboxes = document.querySelectorAll(".checkbox"); function checkCheckboxes() { console.log(Array.from(checkboxes).some((checkbox) => checkbox.checked)); } checkboxes.forEach((checkbox) => { checkbox.addEventListener("change", checkCheckboxes); });
popotte, il y a 4 ans

De rien ;)

Par contre même si ça marche essayes quand même la solution de Mickael, je ne connaissais pas la fonction some, et c'est mieux qu'une loop avec map

En gros dans le dev, il faut appliquer une règle générale:
Quand tu peux éviter une loop, évites la x)