1

tengo una serie de checkbox que al hacer clic sobre ellos se debe activar un botón y esto lo hace bien, pero cuando tengo seleccionado varios checkbox y deseo deseleccionar uno el botón se me deshabilita sin importar que ya tengo seleccionados otros checkbox. Lo que necesito es que el boton permanezca activo mientras por lo menos tengo un checkbox seleccionado.

<input type="checkbox"  onclick="siguiente.disabled=!this.checked">Activa0<br>
<input type="checkbox"  onclick="siguiente.disabled=!this.checked">Activa1<br>

<button id="siguiente" disabled>ACTIVADO</button>

Agradecido de antemano de su ayuda.

1
  • Bienvenido a Stack Overflow en Español @Johan Solano Contreras. Tu problema es simple. El comportamiento de cualquiera de los dos checkboxes onclick="siguiente.disabled=!this.checked" hace que el button se deshabilite cuando el checkbox es desmarcado. Necesitas hacer un pequeño script que verifique el estado de ambos simultáneamente. Trata y si no lo logras responde al comentario y te paso una respuesta mas completa.
    – quevedo
    el 1 jul. 2018 a las 5:41

1 respuesta 1

2

Buen día.

En el evento de onclick, lo tienes como independiente como si fuese solo uno, por lo cual, al deshabilitar el checkbox se deshabilita el botón.

Recomiendo crear una función que lea el estado de los checkboxes y al primero que encuentre habilite el botón, de lo contrario si no hay ninguno seleccionado que lo deshabilite.

Aquí un ejemplo, espero que sirva, saludos!

<html>
<body>
  <input type="checkbox" name="checkbox" onchange="checar()">Activa0<br>
  <input type="checkbox" name="checkbox" onchange="checar()">Activa1<br>
    <input type="checkbox" name="checkbox" onchange="checar()">Activa2<br>

  <button id="siguiente" disabled>ACTIVADO</button>
  <script>

   function checar(){
     var estado = document.getElementsByName("checkbox");
       for (var i = 0; i < estado.length; i++) {
         if(estado[i].checked==true){document.getElementById("siguiente").disabled=false; break;}
         else  document.getElementById("siguiente").disabled=true;
       }
     }

  </script>
</body>
</html>

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.