ロジックの要件は次のとおりです。
- チェックボックスのリストがあります (p:selectManyCheckbox を使用します)。
-チェックされている場合は、他のチェックボックスもチェックする必要があるチェックボックスもあります(これには p:selectBooleanCheckbox を使用します)
-具体的な例を挙げましょう。現在、3つのチェックボックスがあります:
+すべて選択
+アイテム1
+アイテム2
「すべて選択」をチェックすると、「アイテム1」と「アイテム2」がチェックされます。「すべて選択」のチェックを外すと、「項目 1」と「項目 2」のチェックが外れます。
「項目 1」または「項目 2」のいずれかがオフになっている場合は、「すべて選択」もオフにする必要があります。「アイテム 1」と「アイテム 2」の両方がチェックされている場合、「すべて選択」が自動的にチェックされます。
それを実装するために、すべてのチェックボックスの onchange イベントに JavaScript を使用します。
すべて選択の場合、onchange = updateOtherCheckboxes(otherCheckboxes, selectAllCheckbox)
function updateCheckboxes(otherCheckboxes, selectAllCheckbox) {
otherCheckboxes.inputs.each(function() {
if (selectAllCheckbox.isChecked()) {
$(this).prop('checked', false);
} else {
$(this).prop('checked', true);
}
$(this).trigger('click');
});
}
他のチェックボックスの場合、onchange = updateSelectAllCheckbox(otherCheckboxes, selectAllCheckbox)
function updateSelectAllCheckbox(otherCheckboxes, selectAllCheckbox) {
var notAllCheckboxesChecked = false;
otherCheckboxes.inputs.each(function() {
if ($(this).is(':checked') == false) {
notAllCheckboxesChecked = true;
return false;
}
});
if (notAllCheckboxesChecked && selectAllCheckbox.input.is(':checked') == true) {
selectAllCheckbox.input.trigger('click');
} else if (!notAllCheckboxesChecked && selectAllCheckbox.input.is(':checked') == false) {
selectAllCheckbox.input.trigger('click');
}
}
ここでの問題は、 updateCheckboxes() 関数で、他のチェックボックスのクリックイベントがトリガーされ、 updateSelectAllCheckbox が呼び出されることですが、私はそれを望んでいません。では、クリックイベントをトリガーした後、 updateSelectAllCheckbox() 関数が updateCheckboxes() 関数で呼び出されるのを防ぐにはどうすればよいですか。