2012-03-14 3 views
0

в моей JavaScriptРекурсия петля для родительского флажок для проверки всех детей Флажки

$('.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 тр:. Эк (0) ') найти (' ребенок ") .attr ('checked', this.checked);

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

}); 

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

<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> 

рельсы CheckBox

- 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) 

      [email protected]_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 

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

+0

Можете ли вы сделать представителя [JS Fiddle demo] (http://jsfiddle.net/), который демонстрирует, с чем вы работаете? –

+0

http://jsfiddle.net/zF4xJ/ – lifejuggler

ответ

2

Метод «найти» в библиотеке 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 содержит все дочерние флажки, которые вы хотите помеченные выше должен получить все потомков, а не только непосредственные дети.

+0

Я сделал, как вы сказали, Дулан, но он все еще не выполняет рекурсивную итерацию. Я думал, что если бы я должен был сделать .change, он выполнил бы js, пока не закончит третий уровень подщелицы, но сразу же после этого остановится. Пожалуйста помоги!!! – lifejuggler

+0

@ user1193542 Попробуйте изменить свои селекторы, чтобы уловить все флажки под тегом, действующим как родитель. Пример: '$ ('# parent_id'). Find ('input: checkbox')' Более полный пример HTML в исходном вопросе может помочь лучше понять структуру, которую вы просматриваете. – Dulan

Смежные вопросы