【问题标题】:Ruby on Rails, select and deselect all checkboxesRuby on Rails,选择和取消选择所有复选框
【发布时间】:2015-01-14 14:42:52
【问题描述】:

我有一个按钮,当我单击它时,我希望选中所有复选框。通过第二次点击,所有的复选框必须被取消选中。

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



<%= form_tag save_share_patients_clinicdb_grp_pats_path, method: :post do %>

<%= hidden_field_tag 'to_share_group', @to_shr_group%>
<button type="button" id="check_all" class="btw"><%="Check all/Uncheck all"%></button>

    <%@pat_ids.each do |pat_id|
    %>  
        <%= check_box_tag "to_share_patients[]", pat_id.mk1%> <%=pat_id.mk1%>
        <br/>
    <%end%>

<%= button_tag :class => "btn btn-warning", :name => 'share' do %> <%= t "share" %> <% end %> 
<%end%> 

这里有些东西不起作用。你能帮帮我吗?

编辑:

 $('#check_all').on("click", function(){ alert("aaa"); });

不提醒任何东西

在 application.js 中:

//= require jquery
//= require jquery_ujs
//= require jquery.Jcrop
//= require jquery.purr
//= require jquery-fileupload
//= require best_in_place
//= require rails.validations
//= require_self
//= require_tree ./bootstrap
//= require_tree ./jquery
//= require_tree ./menu
//= require_tree ./notifications
//= require_tree ./search
//= require_tree ./sort
//= require dataTables/jquery.dataTables

在 application.html 中

<%= javascript_include_tag 'jquery.min', 'jquery-ui-1.10.4.custom.min.js' %>
<%= stylesheet_link_tag    "/assets/ui-lightness/jquery-ui-1.10.4.custom" %>
<%= javascript_include_tag 'application' %>

【问题讨论】:

  • 您的页面中是否包含 jQuery 库?
  • @jljohnstone 不,我怎样才能包含它?
  • 使用 jquery-rails gem: github.com/rails/jquery-rails 但它应该默认包含在你的 Rails 项目中。也许您已将其从 app/assets/javascripts/application.js 文件中删除
  • gem 'jquery-rails' 在 Gemfile 中,//= 需要 jquery //= 需要 jquery_ujs 在 application.js 中,但它仍然不起作用
  • 您是否在应用程序布局文件 (app/views/layouts/application.html.erb) 中包含您的 javascript,如下所示:&lt;%= javascript_include_tag 'application' %&gt;

标签: jquery ruby-on-rails checkbox


【解决方案1】:

你试图在元素“check_all”被加载之前调用它的“click”事件。因此只有警报功能不起作用。

$(document).ready(function(){
   $('#check_all').on("click", function(){ alert("hi") });
});

用于选择复选框,

$(document).ready(function(){
   $('#check_all').on("click", function() {
     // grouping all the checkbox using the classname
     var checkboxes = $("class name for the checkbox");
     // check whether checkboxes are selected.
     if(checkboxes.prop("checked")){
        // if they are selected, unchecking all the checkbox
        checkboxes.prop("checked",false);
     } else {
        // if they are not selected, checking all the checkbox
        checkboxes.prop("checked",true);
     }
   });
});

【讨论】:

    【解决方案2】:

    试试这个:

    $('#check_all').on("click", function(){
      var cbxs = $('input[type="checkbox"]');
      cbxs.prop("checked", !cbxs.prop("checked"));
    });
    

    【讨论】:

    • 必须添加 $( function() { })
    • cbxs?真的吗?你可以拼出“复选框”。
    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 2023-04-04
    • 2011-10-09
    • 1970-01-01
    • 1970-01-01
    • 2021-03-22
    • 2012-06-27
    • 1970-01-01
    相关资源
    最近更新 更多