SeguramenteDe acuerdo a la documentación solo necesitas ejecutar el problema es que estás tratando demétodo .bootstrapToggle()
para asignar el nuevo estado on => activo o checked
con base en el valor actual de cadau checkbox en vez del "Seleccionar todo", de forma que no importa cuáles estén marcadosoff => inactivo o !checked
y cuáles no, siempre se van a poner todos iguales.
Otra mejorarequiere que probablemente necesitas en tu script es cambiar claseesté dentro de launa etiqueta cuando se marcan o desmarcan individualmente:
// Marcar o desmarcar todos los checkboxes
$("#todos").on('click', function() {
// Obtener valor que se aplicará todos en la tabla
let checked = $(this).prop('checked');
$('#table_Permisos input[type="checkbox"]').each(function() {
// Marcar o desmarcar
$(this).prop('checked', checked);
// Agregar o quitar clase
if(checked) {
$(this).parents('label').addClass('active');
? }'on' else: {'off';
$(this).parents('label''#table_Permisos input[type="checkbox"]').removeClassbootstrapToggle('active');
}
}checked);
});
// Cambiar claseSolo depara etiquetaverificar alque marcarse oactualizan desmarcarlos checkboxvalores
$('#table_Permisos input[type="checkbox"]').on('click''change', function() {
ifconsole.log($(this).prop('checked')) {
// Esta marcado, agregar clase
$(this).parents('label').addClass('active');
} else {
// Esta desmarcado, quitar clase
$(this).parents('label').removeClass('active');
}
});
label.active {
background:#00a;
}
<link href="https://cdn.jsdelivr.net/gh/gitbrent/[email protected]/css/bootstrap4-toggle.min.css" rel="stylesheet">
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.0/jquery.min.js"></script>
<script src="https://cdn.jsdelivr.net/gh/gitbrent/[email protected]/js/bootstrap4-toggle.min.js"></script>
<table id="table_Permisos">
<tr>
<td><label><input<td><input type="checkbox"></label><type="checkbox" data-toggle="toggle"></td>
<td><label><input<td><input type="checkbox"></label><type="checkbox" data-toggle="toggle"></td>
<td><label><input<td><input type="checkbox"></label><type="checkbox" data-toggle="toggle"></td>
</tr>
</table>
<label><input type="checkbox" id="todos"> Marcar / desmarcar todos</label>