嗨我试图“检查所有或取消选择所有”复选框在我的Rails应用程序。它在我使用复选框和JS时工作。但是，我也希望用户具有与链接相同的功能。所以，当点击链接时，它将“检查全部或全部取消”复选框。选择所有复选框javascript

感谢，

<!-- Split button --> 
    <div class="btn-group"> 
    <button type="button" class="btn btn-warning"><input type="checkbox" id="selecctall" value="selectAll"></button> 
    <button type="button" class="btn btn-warning dropdown-toggle" data-toggle="dropdown" aria-expanded="false"> 
     <span class="caret"></span> 
    </button> 

    <ul class="dropdown-menu" role="menu"> 
     <li><a id="selectAll" title="Click to do something" href="#" onclick="check();return false;">Select All</a></li> 
     <li><a id="selectAll" title="Click to do something" href="#" onclick="uncheck();return false;">None</a></li> 
    </ul> 
    </div>

这是循环哪里旁边的每个用户我的复选框。

<% @users.each do |user| %> 
    <tr class="<%= cycle("even", "odd") %>"> 
    <td><input id= "user_id_<%="#{user.id}"%>" name="user_ids[]" value=<%= user.id %> type="checkbox" class="checkbox1"></td> 
    <td><%= user.full_name %></td> 
    <td><%= user.email %></td> 
    <td> 
    <% end %>

这是JS在页面的底部

<% content_for :javascripts do %> 
     <script > 
     function check() { 
      if(document.getElementById("selecctall").checked = true; 
     } 

     function uncheck() { 
     document.getElementById("selecctall").checked = false; 
     } 

    $(document).ready(function() { 
     $('#selecctall').click(function(event) { 
      if(this.checked) { 
       $('.checkbox1').each(function() { 
        this.checked = true; 
       }); 
      }else{ 
       $('.checkbox1').each(function() { 
        this.checked = false; 
       }); 
      } 
     }); 

    }); 
    $('body').on('hidden.bs.modal', '.modal', function() { 
     $(this).removeData('bs.modal'); 
    }); 
    </script>

来源

2015-01-16 Raz

注意the ID of an element must be unique。

当查找由ID的元素，JavaScript的匹配仅单个元件的，因为它假设该ID是唯一的合同尊重。

如果你有两个环节，一个是“选择所有”为“选择无”，给他们每个人不同的ID（或类名）和一个，并有不同的$(...).click(function() { ... });回调为他们每个人。

首先，它只是做check，而另一方面，它做uncheck。

通知您click回调如何有一个if (this.checked) ...部分。如果this是一个复选框，它就不起作用。取决于按下哪个链接，如果您打算选中或取消选中，则已知道，这就是每个链接的单独回调有意义的原因。

来源

2015-01-16 20:29:49 EyasSH

嗨EysaSh，谢谢。我有女佣这种变化。 – Raz

由于EyasSH声明你不应该使用重复的ID，因为这是一个可怕的做法和无效。这就是为什么$('#selectall')只返回一个元素。但是您可以更改选择器，使其找到重复ID的所有实例，将其更改为$('[id="selectall"]')

来源

2015-01-16 20:36:34 almightyBoognish

选择所有复选框javascript

这是循环哪里旁边的每个用户我的复选框。

这是JS在页面的底部

回答

相关问题