Hi I'm trying to "check all or deselect all" check boxes in my rails app. it does working when I use the checkbox and JS. But, I also want the user the have the same function with links as well. So, when the click on the link it will "check all or deselect all" checkboxes.
Thanks,
<!-- 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>
This is the loop where next to each user I have the checkbox.
<% @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 %>
This is the js at the bottom of the page
<% 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>
Aucun commentaire:
Enregistrer un commentaire