Цикл рекурсии для родительского флажка для проверки всех дочерних флажков

в моем джаваскрипте

 $('.ic_parent').change(function(){
   if ($(this).attr('checked')){
      $('#update_ics_table').find('input:checkbox[id = "child-of-' + $(this).attr('value') + '"]').attr('checked', 'checked');

//$(this).parents('tbody tr:eq(0)').find('.child').attr('checked', this.checked);

 }else{
    $('#update_ics_table').find('input:checkbox[id = "child-of-' + $(this).attr('value') + '"]').removeAttr('checked');
 }

 });

мой исходный код html

    <tr class='root' id='DB'>
      <td>DB</td>
      <td><input class="ic_parent" id="ic_root" name="ic_root" type="checkbox" value="DB" /></td>
    </tr>
    <tr class='child-of-DB' id='DBmanual'>
      <td>manual</td>
      <td><input class="ic_parent" id="child-of-DB" name="child-of-DB" type="checkbox" value="DBmanual" /></td>
    </tr>

    <tr class='child-of-DBmanual' id='DBmanualwarmstandby'>
      <td>warmstandby</td>
      <td><input class="ic_parent" id="child-of-DBmanual" name="child-of-DBmanual" type="checkbox" value="DBmanualwarmstandby" /></td>
    </tr>
    <tr class='child-of-DBmanualwarmstandby' id='802'>
      <!-- /%td= link_to ic.name, edit_ic_path(ic.id) -->
      <td><a href="/ics/802">upgrade_7</a></td>
      <td><input id="ic_ids_" name="ic_ids[]" type="checkbox" value="802" /></td>

    </tr>
    <tr class='child-of-DBmanualwarmstandby' id='810'>
      <!-- /%td= link_to ic.name, edit_ic_path(ic.id) -->
      <td><a href="/ics/810">break_destroy_7</a></td>
      <td><input id="ic_ids_" name="ic_ids[]" type="checkbox" value="810" /></td>
    </tr>
    <tr class='child-of-DBmanualwarmstandby' id='809'>
      <!-- /%td= link_to ic.name, edit_ic_path(ic.id) -->

      <td><a href="/ics/809">break_destroy_5</a></td>
      <td><input id="ic_ids_" name="ic_ids[]" type="checkbox" value="809" /></td>
    </tr>
    <tr class='child-of-DBmanualwarmstandby' id='808'>
      <!-- /%td= link_to ic.name, edit_ic_path(ic.id) -->
      <td><a href="/ics/808">break_destroy_1</a></td>
      <td><input id="ic_ids_" name="ic_ids[]" type="checkbox" value="808" /></td>
    </tr>

    <tr class='child-of-DBmanualwarmstandby' id='807'>
      <!-- /%td= link_to ic.name, edit_ic_path(ic.id) -->
      <td><a href="/ics/807">ic alerts_7</a></td>
      <td><input id="ic_ids_" name="ic_ids[]" type="checkbox" value="807" /></td>
    </tr>
    <tr class='child-of-DBmanualwarmstandby' id='806'>
      <!-- /%td= link_to ic.name, edit_ic_path(ic.id) -->
      <td><a href="/ics/806">ic alerts_1</a></td>

      <td><input id="ic_ids_" name="ic_ids[]" type="checkbox" value="806" /></td>
    </tr>
    <tr class='child-of-DBmanualwarmstandby' id='805'>
      <!-- /%td= link_to ic.name, edit_ic_path(ic.id) -->
      <td><a href="/ics/805">failoverdb_3</a></td>
      <td><input id="ic_ids_" name="ic_ids[]" type="checkbox" value="805" /></td>
    </tr>
    <tr class='child-of-DBmanualwarmstandby' id='804'>

      <!-- /%td= link_to ic.name, edit_ic_path(ic.id) -->
      <td><a href="/ics/804">modify_all</a></td>
      <td><input id="ic_ids_" name="ic_ids[]" type="checkbox" value="804" /></td>
    </tr>
    <tr class='child-of-DBmanualwarmstandby' id='803'>
      <!-- /%td= link_to ic.name, edit_ic_path(ic.id) -->
      <td><a href="/ics/803">general_func_5</a></td>
      <td><input id="ic_ids_" name="ic_ids[]" type="checkbox" value="803" /></td>

    </tr>

флажок рельсы

  - Ic.make_tree(@ics).values.each do |root|

  %tr{:id => root.tree_id, :class => "root"}

    %td= root.root_name

    - if show_check_boxes

      %td= check_box_tag "ic_root", "#{root.tree_id}", false, :class => "#{root.tree_id}" 


  - root.suites.each do |suite|

    %tr{:id => suite.tree_id, :class => "child-of-#{root.tree_id}"}

      %td= suite.suite_name

      - if show_check_boxes

        %td= check_box_tag "child-of-#{root.tree_id}", "#{suite.tree_id}", false, :class => "child-of-#{root.tree_id}"


    - suite.children.each do |case_item|

      %tr{:id => case_item.tree_id, :class => "child-of-#{suite.tree_id}"}

        %td= case_item.case_name

        - if show_check_boxes

          %td= check_box_tag "child-of-#{suite.tree_id}", "#{case_item.tree_id}", false, :class => "child-of-#{suite.tree_id}"


      - case_item.children.each do |ic|

        %tr{:id => ic.id, :class => "child-of-#{case_item.tree_id}"}

          //%td= link_to ic.name, edit_ic_path(ic.id)

          -@ic_model=Ic.find(ic.id)

          -puts "inside _listing ic_id=#{ic.id}"

          %td= link_to ic.name, ic_path(ic.id)

          - if show_check_boxes

            %td= check_box_tag "ic_ids[]", "#{ic.id}", false

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


person lifejuggler    schedule 14.03.2012    source источник
comment
Можете ли вы сделать представительную демонстрацию JS Fiddle, демонстрирующую, с чем вы работаете?   -  person David says reinstate Monica    schedule 15.03.2012


Ответы (1)


В этом случае может быть полезен метод «найти» в библиотеке jQuery.

Документация @ http://api.jquery.com/find/

$('input[type=checkbox]').live('change',function(){
    if ($(this).attr('checked')){
        $('#update_ics_table').find('input:checkbox[id = "child-of-' + $(this).attr('value') + '"]').attr('checked', 'checked');
    } else {
        $('#update_ics_table'.find('input:checkbox[id = "child-of-' + $(this).attr('value') + '"]').removeAttr('checked');
    }
});

Предполагая, что #update_ics_table содержит все дочерние флажки, которые вы хотите отметить, приведенное выше должно получить все потомки, а не только непосредственные дочерние элементы.

person Dulan    schedule 14.03.2012
comment
Я сделал, как вы сказали, Дулан, но он все еще не выполняет рекурсивную итерацию. Я думал, что если я сделаю .change, он будет выполнять js, пока не дойдет до третьего дочернего уровня, но он остановится сразу после первого. Пожалуйста помоги!!! - person lifejuggler; 15.03.2012
comment
@user1193542 user1193542 Попробуйте изменить свои селекторы, чтобы поймать все флажки под тегом, действующим как родительский. Пример: $('#parent_id').find('input:checkbox') Более полный пример HTML в исходном вопросе также может помочь лучше понять структуру, которую вы просматриваете. - person Dulan; 15.03.2012