Accès radioéléments sous formes en javascript

Question

J'ai un cas d'utilisation où le nombre de boutons radio peut être 1 ou plus, ce qui est la meilleure pratique pour vérifier

-à-dire

var radioElements = document.forms["formname"].elements["abc"]; 
for(var i=0; i < radioElements.length; i++) { 
    if(radioElements[i].checked) { 
     alert("blah.."); 
     break; 
    } 
} 

Cela fonctionne lorsque DOM a

<form name="formname"> 
    <input type=radio name=abc id=abc value=aaa/> 
    <input type=radio name=abc id=abc value=bbb/> 
</form> 

Mais ne fonctionne pas quand il n'a qu'un seul élément radio

<form name="formname"> 
    <input type=radio name=abc id=abc value=aaa/> 
</form> 

Comment puis-je faire fonctionner le javascript ci-dessus dans les deux cas.

Answer 1

Vous pouvez utiliser getElementsByName. Cette méthode renvoie toujours une collection que vous pouvez parcourir:

var radioElements = document.getElementsByName("abc"); 
for(var i=0; i < radioElements.length; i++) 
{ 
    if(radioElements[i].checked) 
    { 
     alert("blah.."); 
     break; 
    } 
} 

Voir un exemple en action à jsfiddle.net/L6SKx/.

Answer 2

Vous accédez aux boutons radio mal:

var radios = document.forms['formname'].abc; 
for (var i = 0; i < radios.length; i++) { 
    if (radios[i].checked) { 
     alert('#' + i + ' is checked, with value ' + radios[i].value); 
    } 
} 

De plus, avec votre exemple multiple bouton radio, il est invalide d'avoir le même ID sur deux ou plusieurs éléments DOM séparés. Un identifiant doit être unique sur la page.