1

Tengo varios lineas de detalle en pantalla, cada una con dos checkbox (uno de ellos bootstrap-toogle) y quisiera que cuando el primer checkbox se active, se enable el segundo y se ponga en on, y cuando se desactive el primer checkbox, se ponga en disable y en off (siempre el de la misma linea).

Codigo del primer checkbox:

echo "<td><input type='checkbox' class='checkbox_class' name='baja[]' value='' id='check1' onclick='validar_sino(this);''></td>";

Codigo del segundo checkbox:

echo "<td><input type='checkbox' disabled name='sino' id='sino' data-toggle='toggle' data-size='mini' data-on='Si' data-off='No' data-onstyle='success' data-offstyle='danger'></td>"; 

Codigo javascript

<script type="text/javascript">  
function validar_sino(elemento) { 
    var checkbox1 = document.getElementById("check1"); 
    if (checkbox1.checked == true) { 
        $('#sino').bootstrapToggle('on');           
        $('#sino').bootstrapToggle('enable'); 
    } else { 
        $('#sino').bootstrapToggle('off');         
        $('#sino').bootstrapToggle('disable'); 
    } 
} 
</script>  

Alguien me puede ayudar?

Un saludo.

1 respuesta 1

1

Por lo que veo en tu código al parecer usas jQuery, por lo cual propongo una solución con dicho framework:

Consiste en detectar cuando cambia un elemento con la clase checkbox class y que esté contenido en un <td>, a continuación buscamos los siguientes <td> (teniendo en cuenta que no conocemos la totalidad de tu código y no sé si hayan más td entre los dos que nos importan), posteriormente encontramos sus elementos "checkbox" contenidos en dichos td y activamos/desactivamos según el nuevo estado de nuestro primer checkbox:

$('td .checkbox_class').change(function() {
  var nextCheckbox = $(this).parent().nextAll('td').children('[type=checkbox]');
  if ($(this).is(':checked')) {
    nextCheckbox.prop('disabled', false);      
  } else {
    nextCheckbox.prop('disabled', true).prop('checked', false);
  }
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<table>
  <tr>
    <td><input type='checkbox' class='checkbox_class' name='baja[]' value='' id='check1'/></td>
    <td><input type='checkbox' disabled name='sino' id='sino' data-toggle='toggle' data-size='mini' data-on='Si' data-off='No' data-onstyle='success' data-offstyle='danger'></td>
  </tr>
  <tr>
    <td><input type='checkbox' class='checkbox_class' name='baja2[]' value='' id='check2'/></td>
    <td><input type='checkbox' disabled name='sino2' id='sino2' data-toggle='toggle' data-size='mini' data-on='Si' data-off='No' data-onstyle='success' data-offstyle='danger'></td>
  </tr>
<table>

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.