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创建一个按钮,该按钮将选中/取消选中表单上的所有框.

将此代码放在您希望选中/取消选中按钮的视图中.单击该按钮时,它将运行toggleChecked javascript函数.

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

将您的JavaScript代码放在视图的底部.

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

该函数也可以放入assets/javascripts中的相应.js文件中.

这应该可以帮助你正常运转.

---------------更新------------------

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>