Как проверить состояние checkbox с помощью jquery?

Question

[mxbeat]

Есть 4 чекбокса:
1) Все (поумолчанию отмечен)
2) Чекбокс1
3) Чекбокс2
4) Чекбокс3

Пытаюсь сделать так, чтобы когда выбираешь Чекбокс1, Чекбокс2 или Чекбокс3, то с чекбокса "Все" снималась отметка и наоборот, если снимаешь отметки со всех чекбоксов, то "Все" отмечалось автоматически. Также если кликнуть "Все", то остальные отметки чтобы снимались.

Есть код, но он работает на половину (отметка "Все" снимается, если отметить другие, но обратно не ставится, если снять все отметки):

$('.form__chekbox_label').click(function () {
		if ($(this).hasClass('.form__chekbox_label_all')) {
			$('.form__chekbox').prop('checked', false);
		} else {
			$('.form__chekbox_all').prop('checked', false);
		} 
});
$('.form__chekbox_label_all').click(function () {
			$('.form__chekbox').prop('checked', false);
});

Ссылка на codepen: https://codepen.io/maxbeat/pen/JjXZrZp

Подскажите в чем ошибка?

Answer 1

[0xD34F]

const $checkbox = $('.form__chekbox');
const $cbAll = $checkbox.filter('.form__chekbox_all');
const $cb = $checkbox.not($cbAll);

$cbAll.change(e => $cb.prop('checked', false));

$cb.change(() => {
  const $checked = $cb.filter(':checked');
  const allChecked = $checked.length === $cb.length;
  $cbAll.prop('checked', !$checked.length || allChecked);
  $cb.prop('checked', (i, val) => allChecked ? false : val);
});

Answer 2

[DanKud]

let checkboxes = $('.form__chekbox:not(.form__chekbox_all)');
checkboxes.on('click', () => {
    let status = (!checkboxes.is(':checked')) ? true : false;
    $('.form__chekbox_all').prop('checked', status);
});