Skip to content
Turns a checkbox into one that selects or deselects other checkboxes on the page
JavaScript
Find file
Fetching latest commit…
Cannot retrieve the latest commit at this time.
Failed to load latest commit information.
README.md
jquery.selectall.js

README.md

jquery.selectall

A checkbox named 'select-all' that checks and un-checks all others on the page

$('input[name"select-all"]').selectAll();

The defaults can be very inefficient. It's better to specify the selector for the group of checkboxes and each row

$('input.select-all').selectAll({
  group: 'form.some_form',
  row: 'input.some_inputs'
});

You can also specify a callback method for when checkboxes change their value

$('input.select-all').selectAll({
  onchange: function(checked, unchecked){
    /* do some stuff */
  }
});

For example, highlight the checked rows in a table (this 'info' class works with twitter bootstrap)

$('input.select-all').selectAll({
  onchange: function(checked, unchecked){
    $(checked).closest('tr').addClass('info');
    $(unchecked).closest('tr').removeClass('info');
  }
});

As a bonus, throw this in to be able to toggle a checkbox when clicking on its table row

$(document).on('click', 'tr', function(e){
  var checkbox = $(this).find('input[type="checkbox"]');
  checkbox.prop('checked', !checkbox.prop('checked'));
  checkbox.trigger('change');
});
Something went wrong with that request. Please try again.