Функция "выбрать все" и iCheck

Я хочу реализовать "Выбрать все", используя iCheck.

Это то, что я сделал до сих пор:

$(function () {
    $('input').iCheck();
    $('input.all').on('ifChecked ifUnchecked', function(event) {
        if (event.type == 'ifChecked') {
            $('input.check').iCheck('check');
        } else {
            $('input.check').iCheck('uncheck');
        }
    });
    $('input.check').on('ifUnchecked', function(event) {
        $('input.all').iCheck('uncheck');
    });
});

Сценарий: jsfiddle.net/N7uYR/1/

Я хочу, чтобы при выборе "флажок 1", "флажок 2", "флажок 3", "флажок 4" выбрано "Выбрать все".

Точно так: jsfiddle.net/ivanionut/N7uYR/

Как я могу это сделать?

Ответ 1

Вот что я придумал.

$(function () {
    var checkAll = $('input.all');
    var checkboxes = $('input.check');

    $('input').iCheck();

    checkAll.on('ifChecked ifUnchecked', function(event) {        
        if (event.type == 'ifChecked') {
            checkboxes.iCheck('check');
        } else {
            checkboxes.iCheck('uncheck');
        }
    });

    checkboxes.on('ifChanged', function(event){
        if(checkboxes.filter(':checked').length == checkboxes.length) {
            checkAll.prop('checked', 'checked');
        } else {
            checkAll.removeProp('checked');
        }
        checkAll.iCheck('update');
    });
});

jsFiddle

Ответ 2

Для тех, кто все еще борется с этим, я немного изменил принятый ответ fooobar.com/questions/352032/...) от Dzulqarnain Nasir.

Я изменил метод removeProp на метод prop:

checkAll.removeProp('checked');

Изменено на

checkAll.prop('checked', false);

Метод removeProp не работал у меня, но установил свойство checked на false.

На момент написания, я использую iCheck 1.0.2 с jQuery 2.1.4

Ответ 3

u может использовать флажок parent of ur checkbox. например

<div class='allchecked'>
<input type="checkbox"/>
<input type="checkbox"/>

и используя jquery для установки attr ( "checked" ) или нет.

Ответ 4

Если кто-то еще сталкивается с этой проблемой, принятый ответ не работал у меня на динамически созданных флажках. Я нашел решение здесь:

https://github.com/fronteed/iCheck/issues/44