¿Cómo verificar si un botón de radio en cada grupo está marcado en jQuery?

Question

múltiples grupos o botones de radio

<h1>Question 1</h1> 
<input type="radio" name="radio1" value="false" /> 
<input type="radio" name="radio1" value="true" /> 

<h1>Question 2</h1> 
<input type="radio" name="radio2" value="false" /> 
<input type="radio" name="radio2" value="true" /> 

¿Cómo puedo comprobar en jQuery que un botón de opción en cada grupo se comprueba?

Gracias.

Answer 1

Aquí es cómo lo haría:

var all_answered = true; 
$("input:radio").each(function(){ 
    var name = $(this).attr("name"); 
    if($("input:radio[name="+name+"]:checked").length == 0) 
    { 
    all_answered = false; 
    } 
}); 
alert(all_answered); 

De esa manera usted no tiene que depender de las etiquetas hermano o padre. Si tus botones de radio están mezclados con cualquier etiqueta, funcionarán. Puede play around with it.

Answer 2

Se podía recorrer cada pregunta (<h1>) y mirando a través de su respuestas usando .nextUntil() con .filter() para ver si hay alguna :checked queridos, como este:

var noAns = $("h1").filter(function() { 
       return $(this).nextUntil("h1").filter(":checked").length == 0; 
      }); 

devolvería todas las preguntas sin radio seleccionada para ellos, se puede comprobar la .length de que si quería ver si cualquier no tienen respuestas, por ejemplo:

if(noAns.length > 0) { 
    alert(noAns.length + " question(s) don't have answers!"); 
} 

You can give it a try here.

---

También puede ampliar esto un poco, por ejemplo, destacando las preguntas que se perdieron:

if(noAns.css({ color: "red" }).length > 0) { 

y utilizar $("h1").css({ color: "" }) para despejarse la siguiente ronda, you can give it a try here.

Answer 3

envolver cada grupos de radio con un form o una div:

<div id="question1"> 
    <h1>Question 1</h1> 
    <input type="radio" name="radio1" value="false" /> 
    <input type="radio" name="radio1" value="true" /> 
</div> 

<div id="question2"> 
    <h1>Question 2</h1> 
    <input type="radio" name="radio2" value="false" /> 
    <input type="radio" name="radio2" value="true" /> 
</div> 

Luego, en jQuery:

if ($('#question1 input[type=radio]:checked')[0] != undefined && $('#question2 input[type=radio]:checked')[0] != undefined) { 
    ... 
} 

Answer 4

I upvoted la respuesta por "GG". Sin embargo, no necesita cambiar el código HTML .

Basta con seleccionar por [nombre] (que debe ser único):

if ($("input[name='radio1']:checked")[0] != undefined && 
    $("input[name='radio2']:checked")[0] != undefined) { 
    ... 
}