Tengo un checkboc en el encabezado de mi columna. Al hacer clic en él, todas las casillas de verificación deben marcarse y al deseleccionar la checkbox principal, todas deben estar desmarcadas. Busqué en Google pero obtuve solo el código de JavaScript para este tipo de cosas. Pero quiero una cosa pura de JQuery. Estoy pegando mi código aquí. Ahora, al hacer clic en la checkbox maestra, todas las casillas de verificación están marcando, pero la checkbox maestra en sí misma ¿Puede alguien ayudarme con el código de jquery?
Esta es mi casilla de encabezado:
El método Onclick es
function checkBoxChecked(){ try{ var checkboxes=document.getElementsByName("test"); for(i=0;i<document.getElementsByName("test").length;i++) { checkboxes[i].checked = "checked"; } } catch(e) { } document.getElementById("mastercheck").checked="checked"; return true; }
HTML:
JQuery:
$(document).ready(function () { $("#ckbCheckAll").click(function () { $(".checkBoxClass").prop('checked', $(this).prop('checked')); }); });
Demo en vivo
$(document).ready(function() { $("#mastercheck").click(function() { var checkBoxes = $("input[name=test]"); checkBoxes.prop("checked", this.checked); }); });
Tratar
function checkBoxChecked() { $('input[name=test]').prop('checked', $('#mastercheck').is(':checked')) }
La propiedad marcada se debe establecer en true | false true | false
casillas de verificación [i] .checked = true;
Si eso no funciona, debería verificar esta pregunta: Cambiar el estado de una checkbox programáticamente en dashcode
¿Por qué no pruebas algo como esto?
$('.master-checkbox').click(function(){ var master_checkbox = $(this); $('input[type="checkbox"]').prop('checked', master_checkbox.prop('checked')); });
Puedes probar algo como esto:
$('#mastercheck').on('change', function() { if ($(this).is(':checked')) { // Check all $('.childcheck').prop('checked', true); } else { // Uncheck all $('.childcheck').prop('checked', false); } });
Check/Uncheck me
$(document).ready(function() { $('#ckbCheckAll').click(function(){ var isChecked = $('#ckbCheckAll').is(':checked'); if(isChecked) { $('.checkBoxClass').attr('checked', true); } else { $('.checkBoxClass').attr('checked', false); } }); });