Rails 3.1 флажок Выбрать все

Question

это мой взгляд:

 @bulk_objects.each do |bulk_warehouse|
      bulk_error = @wh_errors[:"bulk_warehouse#{@count}"] if @wh_errors      
-%>
<tr class="<%= cycle("odd", "even") %>">
             <%= hidden_field_tag("bulk_warehouse_id#{@count}",bulk_warehouse.id) %>
               <td><%= text_field_tag("bulk_warehouse_asset#{@count}", bulk_warehouse.asset, :disabled => true)%></td>
              <td><%= text_field_tag("bulk_warehouse_serial#{@count}", bulk_warehouse.serial, :disabled => true) %></td>



              <td><%= check_box_tag "enable_record#{@count}",1,false,{:onclick => "bulk_warehouse_asset#{@count}.disabled = 
                                                                                bulk_warehouse_serial#{@count}.disabled = 
                                                                                !this.checked;"}%></td>



                    <td class="last">
                <%= link_to "#{t("web-app-theme.delete", :default => "Delete")}", bulk_warehouse_path(bulk_warehouse), :method => :delete, :confirm => "#{t("web-app-theme.confirm", :default => "Are you sure?")}" %>
              </td>


            </tr>
          </div>          
    <%  @count = @count +1 %>
 <% end -%>
      </table>
       <div class="actions-bar wat-cf">
    <div class="actions">
    </div>
 ..

а это мой контроллер:

 @bulk_objects = BulkWarehouse.all
                         @count= @bulk_objects.count

Теперь я добавил бы в моем представлении флажок «Выбрать все», который при нажатии на него включает все остальные флажки «enable_record # {@ count}». Я знаю, что это нужно делать с помощью Ajax и Jquery, но я не знаю как. Кто-нибудь может мне помочь? Спасибо тебе

Answer 1

Вы можете использовать button_to_function для создания кнопки, которая будет отмечать / снимать все флажки в форме.

Поместите этот код в поле вашего зрения, куда вы хотите, чтобы ходила кнопка «Выключить / снять». Когда кнопка нажата, она запускает функцию javascript toggleChecked.

<%= button_to_function "Check / Uncheck All", "toggleChecked()" >

Разместите код JavaScript в нижней части окна.

<script type='text/javascript'>
    var toggleChecked = function() { $('input[type="checkbox"]').click(); });
</script>

Эту функцию также можно поместить в соответствующий файл .js в assets / javascripts.

Это должно привести вас в порядок.

--------------- ОБНОВЛЕНИЕ ------------------

Button_to_function теперь устарела. Я рекомендую обрабатывать это, используя кнопку HTML5 и jQuery.

Просмотр кода для вашей кнопки:

<button type="button" id="check_all">
    Check / Uncheck All
</button>

Javascript:

<script type='text/javascript'>
    $('#check_all').on("click", function(){ $('input[type="checkbox"]').click(); });
</script>

Answer 2

Просто чтобы расширить ответ @ Аарона, это решило бы проблему ОП без изменения других флажков на странице:

$('#check-all').click(function(e) {
  var checkboxes = $(e.target).closest('table').find('input:checkbox');
  var checked = $(e.target).attr('checked') === undefined;
  checkboxes.attr('checked', checked);
  checkboxes.not('#check-all').click(function() {
    $(e.target).attr('checked', false);
  });
});

Преимущество также состоит в снятии флажка «Выбрать все», если один из флажков снят.