使用collection_check_boxes选中/取消选中所有内容

Question

我正在使用simple_form_for只将符号而不是模型传递给表单，以便将自定义参数发送回控制器。 我设法将复选框默认为默认选中的所有复选框。

我无法弄清楚如何添加一个select / unselect all复选框。我想我在那里需要一些JS，但我不知道我必须更改值的属性。

当我选中/取消选中任何项目但input元素中没有属性发生变化时，我检查了浏览器控制台中是否有任何属性发生了变化。但是，当我选中/取消选中某个项目时，<form>元素会闪烁。这就是我能找到的线索。

= simple_form_for :mass_unassignment, url: admin_merchant_holiday_path(@merchant), method: :post do |f|
    - if @jobs.present?
      %h3 Cleaning
      %table
        %thead
          %tr
            %td= check_box_tag :mass_select
            %td Id
            %td Date
            %td Customer
        %tbody
          = f.collection_check_boxes :jobs, @jobs, :id, :start_at, checked: @jobs.map(&:id) do |el|
            - job = el.object
            %tr
              %td= el.check_box checked_value: 1
              %td= link_to el.object.id, admin_job_path(job)
              %td= job.start_at.strftime('%e %b %y – %I:%M%P')
              %td= link_to job.customer.full_name, admin_customers_path(job.customer)

Answer 1

这似乎更像是一个Javascript问题，而不是一个RoR问题。 从@jdgray评论中给出的链接，您可以使用：

function toggle(source) {
  checkboxes = document.getElementsByName('foo');
  for(var i=0, n=checkboxes.length;i<n;i++) {
    checkboxes[i].checked = source.checked;
  }
}

或者，如果您使用的是jQuery，那么您可以执行以下操作：

$('#all-check').change(function(){
    if ($(this).prop('checked')){
        $('form :checked').each(function(){
            $(this).prop('checked', true);
        });
    }else{
        $('form :checked').each(function(){
            $(this).prop('checked', false);
        });
    }
});