チェックボックス配列を繰り返しチェックするかどうかを確認する

Question

「すべてを選択」チェックボックスがあるテーブルがあります。この表にデータを入力すると、以前に選択されたすべての項目がチェックされます。現在、「すべて選択」チェックボックスは、すべての項目がチェックされていない場合でもチェックされます。私は各チェックボックスを反復処理する関数を作成しようとしていますが、すべてがチェックされていれば、自動的にselect allチェックボックスが切り替わります。すべての項目が選択されていなければ同じロジック - すべて選択チェックボックスは選択されません。

ここで私がこれまで持っているコードです：

function unclickSelectAll(parent) { 
    var $checkboxes = parent.find('input[type="checkbox"]'); 
    var $selectAllCheckbox = $checkboxes.filter('.vendor'); 
    var $invoiceCheckBoxes = $checkboxes.filter('.invoice'); 
    $invoiceCheckBoxes.each(function(i, c) { 
     var checkbox = $(this); 
     if (checkbox[i].checked) { 
      $selectAllCheckbox.prop('checked', true); 
     } else { 
     $selectAllCheckbox.prop('checked', false); 
    } 
    }); 
}; 

何現在起こることは、それが最初のチェックボックスをループすることであり、それがチェックされます場合は、それが真の選択すべてのチェックボックスのcheckedプロパティを変更しますが、 。次のループを通して、チェックボックス[i]の 'checked'プロパティが見つからないというエラーが出ます。

Answer 1

：http://plnkr.co/edit/iSrpfjd4Z7FUIhQkewcF?p=preview

Answer 2

各チェックボックスをテストした後、すべて選択チェックボックスの状態を切り替えるので、最終状態は最後のチェックボックスだけに基づいています。すべてのチェックボックスがオンになっているかどうかをテストする必要があります。チェックボックスの数とチェックボックスの数を数えるだけで、これを行うことができます。カウントが同じであれば、すべてチェックされます。あなたは

$('.invoice:checkbox').click(function() { 
    unclickSelectAll(); 
}); 

function unclickSelectAll() { 
    var allSelected = $('.invoice:checked:checkbox').length === $('.invoice:checkbox').length; 
    $('.vendor:checkbox').prop('checked', allSelected); 
} 

plunkerような何か行うことができます

if (parent.find(':checkbox').length == parent.find(':checkbox:checked').length) { 
    $selectallCheckbox.prop('checked', true); 
} else { 
    $selectallCheckbox.prop('checked', false); 
}