Jquery, динамический флажок выбора

Question

У меня есть выпадающий список с различными категориями, которые я установки, как это:

Main1
SUB1
sub1
sub1

Main2
SUB2
sub2
sub2

т.д.

Когда я нажимаю на "Main1" все "SUB1" s будут проверены, и так далее. Я создал функцию, которая работает.

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

     var checkboxes = $(".check_1"); 

     if($(this).is(':checked')) { 

      checkboxes.prop('checked', true); 

     } else { 

      checkboxes.prop('checked', false); 

     } 
    }); 

, но только если у меня есть жесткий код, он не работает динамически.

(На моей странице администратора я смогу добавить больше и дать им идентификатор, главный «1», под «1» и т. Д.).

Любая идея, как я мог это сделать?

Answer 1

изменения кода в следующий может помочь

$(document).on('change', '.main_check', function() { 
    var mainCheck = $(this), 
     subChecks = mainCheck.children('.sub-check'); 

    if(mainCheck.is(':checked')) { 

     checkboxes.prop('checked', true); 

    } else { 

     checkboxes.prop('checked', false); 

    } 
}); 

Просто использовать «на» методе.

Answer 2

Это может быть полезно - уведомления, как я Управлял HTML:

$('#main_check_1').click(function() { 
this_box = $(this); 
     var checkboxes = $('.check1'); 

    checkboxes.each(function(){ 
     checkboxes.prop('checked', true); 
     if(this_box.is(':checked')) { 

      checkboxes.prop('checked', true); 

     } else { 

      checkboxes.prop('checked', false); 

     } 
    }); 

    }); 

JSFiddle

Answer 3

Вместо того чтобы дать СЕТЕВЫМ уникальное имя класса, вы могли бы дать им уникальный идентификатор-имя, а и уникальное имя класса, например «контрольный список». Убедитесь, что имена классов подсайтов совпадают с именами parent-main. Теперь вы можете сделать что-то вроде:

$('.checklist').change(function() { 
    var mainCheck = this; 
    $("." + mainCheck.id).each(function() { 
     $(this).prop('checked', $(mainCheck).prop('checked')); 
    }); 
}); 

JSFiddle