Установите главный флажок true, если все флажки sbu верны

Question

У меня есть таблица, имеющая два типа строк (основная строка и подстрока). Идентификатор строки основной строки - «mainRow» + prId (атрибут tr). Идентификатор строки подстроки является «subRow» + prId (атрибут tr) + rowNo.

Что мне нужно сделать, так это, если все флажки подстрочных строк отмечены, тогда необходимо проверить флажок основной строки. Кто-нибудь может мне помочь.

<tr id="mainRow2" prId = "2"><td><input type="checkbox" id="main0" ></td></tr> 
    <tr id="subRow2_1" prId = "2"><td><input type="checkbox" id="subRow2_1_1" ></td></tr> 
    <tr id="subRow2_2" prId = "2"><td><input type="checkbox" id="subRow2_2_1" ></td></tr> 
    <tr id="subRow2_3" prId = "2"><td><input type="checkbox" id="subRow2_3_1" ></td></tr> 

<tr id="mainRow5" prId = "5"><td><input type="checkbox" id="main1" ></td></tr> 
    <tr id="subRow5_1" prId = "5"><td><input type="checkbox" id="subRow5_1_1" ></td></tr> 
    <tr id="subRow5_2" prId = "5"><td><input type="checkbox" id="subRow5_2_1" ></td></tr> 
    <tr id="subRow5_3" prId = "5"><td><input type="checkbox" id="subRow5_3_1" ></td></tr> 
    <tr id="subRow5_4" prId = "5"><td><input type="checkbox" id="subRow5_4_1" ></td></tr> 

Answer 1

Добавьте на свою страницу код jQuery (убедитесь, что вы используете скрипт jQuery на своей странице).

Хотя ваша организация флажков неверна, и вы должны работать над реорганизацией таблицы.

$('input').change(function() { 

    $("tr[id^='mainRow']").each(function(i,v){ 
    var id = $(v).attr('id'); 
    id = id.split('mainRow')[1]; 
    var subs = $("input[id^='subRow"+id+"']"); 
    var checkedSubs = $("input[id^='subRow"+id+"']:checked"); 
    console.log(checkedSubs.length); 

    if(subs.length == checkedSubs.length) 
     $('input',v).attr('checked',true); 
    else 
     $('input',v).attr('checked',false); 
    }); 

}); 

Live example here.