jQuery: establishing a relation between check-all checkbox and the child checkboxes -
this standard scenario have check-all checkbox check or uncheck group of checkboxes based on own state.
$('.checkall').on('click', function () { $(this) .closest('#grid') .find('#tblid') .find(':checkbox') .prop('checked', this.checked); });
if child checkboxes modified individually, manipulate state of check-all checkbox this:
$('.child-checkbox').change(function () { if ($('.child-checkbox:checked').length == $('.child-checkbox').length) { $('.checkall').prop('checked', true); } else { $('.checkall').prop('checked', false); } });
i happy working expected, want know if can combine these 2 snippets in such way relation between check-all checkbox , child checkboxes managed in 1 snippet.
i don't think can nicely combined 1 snippet, can see can simplified
var $all = $('.checkall').on('click', function () { $childs.prop('checked', this.checked); }); var $children = $('.child-checkbox').change(function () { $all.prop('checked', $children.not(':checked').length != 0); });
if still looking single handler try
$('.checkall, .child-checkbox').change(function () { if ($(this).is('.checkall')) { $('.child-checkbox').prop('checked', this.checked); } else { $('.checkall').prop('checked', $children.not(':checked').length != 0); } })
Comments
Post a Comment