Activar boton de enviar al seleccionar radio button

pepeart01 · #1 (**permalink**) 08/07/2011, 15:40

Hola amigos, estoy tratando de hacer un formulario que utiliza radio button la idea es que al inicio como no esta seleccionado nada esten los botones de enviar y borrar desactivos y que solamente al seleccionar todos los grupos Radio Buttons me active ambos botones se hacer que almenos uno este seleccionado pero no que todos esten seleccionados espero me puedan orientar, a resolver esta situacion, de antemano gracias.

Aquí les dejo mi codigo

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Documento sin título</title>
<script>
function enviar(){
document.form1.button.disabled = true;
document.form1.button2.disabled = true;
for (i=0 ;i<document.form1.elements.length;i++){
if(document.form1.elements[i].type == "radio"){
if(document.form1.elements[i].checked == 1 ){
document.form1.button.disabled = false;
document.form1.button2.disabled = false;
i=document.form1.elements.length+10;
}
}
}
}
function resetear(){
document.form1.p_1_0.checked=false;
document.form1.p_1_1.checked=false;
document.form1.p_2_0.checked=false;
document.form1.p_2_1.checked=false;
document.form1.button.disabled = true;
document.form1.button2.disabled = true;
}
</script>
</head>

<body>
<form id="form1" name="form1" method="post" action="">
<p>pregunta 1</p>
<p>
<label>
<input type="radio" name="p_1" value="SI" id="p_1_0" onclick="enviar();" />
SI</label>
<br />
<label>
<input type="radio" name="p_1" value="NO" id="p_1_1" onclick="enviar();" />
NO
</label>
</p>
<p>Pregunta 2</p>
<p>
<label>
<input type="radio" name="p_2" value="SI" id="p_2_0" onclick="enviar();"/>
SI</label>
<br />
<label>
<input type="radio" name="p_2" value="NO" id="p_2_1" onclick="enviar();" />
NO</label>
<br />
<br />
</p>
<p>
<label>
<input type="submit" name="button" id="button" value="Enviar" disabled="disabled" />
</label>
<label>
<input type="button" name="button2" id="button2" value="Restablecer" disabled="disabled" onclick="resetear();" />
</label>
</p>
</form>
</body>
</html>

jahepi · #2 (**permalink**) 08/07/2011, 16:35

Hola pepeart01 !

Podrías hacerlo con una variable que contenga el total de grupos de preguntas que en este caso son 2, y otra variable contador que se incremente por cada checkbox seleccionado en cada grupo, al final compararías el total de grupos con la variable que hizo el conteo de las respuestas seleccionadas:

Código javascript:

Ver originalfunction enviar() {
    var total_groups = 2;
    var checked = 0;
    for (i=0; i < document.form1.elements.length; i++) {
        if(document.form1.elements[i].type == "radio") {
            if(document.form1.elements[i].checked) {
                checked++;
            }
        }
    }
    
    if(total_groups == checked) {
        document.form1.button.disabled = false;
        document.form1.button2.disabled = false;
    }
}

Un saludo y suerte !

pepeart01 · #3 (**permalink**) 11/07/2011, 13:25

Hola jahepi, muchas gracias por tu respuesta ya la probe y funciona perfecto.