tableselect.js 3.8 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596
  1. (function ($) {
  2. Drupal.behaviors.tableSelect = {
  3. attach: function (context, settings) {
  4. // Select the inner-most table in case of nested tables.
  5. $('th.select-all', context).closest('table').once('table-select', Drupal.tableSelect);
  6. }
  7. };
  8. Drupal.tableSelect = function () {
  9. // Do not add a "Select all" checkbox if there are no rows with checkboxes in the table
  10. if ($('td input:checkbox', this).length == 0) {
  11. return;
  12. }
  13. // Keep track of the table, which checkbox is checked and alias the settings.
  14. var table = this, checkboxes, lastChecked;
  15. var strings = { 'selectAll': Drupal.t('Select all rows in this table'), 'selectNone': Drupal.t('Deselect all rows in this table') };
  16. var updateSelectAll = function (state) {
  17. // Update table's select-all checkbox (and sticky header's if available).
  18. $(table).prev('table.sticky-header').andSelf().find('th.select-all input:checkbox').each(function() {
  19. $(this).attr('title', state ? strings.selectNone : strings.selectAll);
  20. this.checked = state;
  21. });
  22. };
  23. // Find all <th> with class select-all, and insert the check all checkbox.
  24. $('th.select-all', table).prepend($('<input type="checkbox" class="form-checkbox" />').attr('title', strings.selectAll)).click(function (event) {
  25. if ($(event.target).is('input:checkbox')) {
  26. // Loop through all checkboxes and set their state to the select all checkbox' state.
  27. checkboxes.each(function () {
  28. this.checked = event.target.checked;
  29. // Either add or remove the selected class based on the state of the check all checkbox.
  30. $(this).closest('tr').toggleClass('selected', this.checked);
  31. });
  32. // Update the title and the state of the check all box.
  33. updateSelectAll(event.target.checked);
  34. }
  35. });
  36. // For each of the checkboxes within the table that are not disabled.
  37. checkboxes = $('td input:checkbox:enabled', table).click(function (e) {
  38. // Either add or remove the selected class based on the state of the check all checkbox.
  39. $(this).closest('tr').toggleClass('selected', this.checked);
  40. // If this is a shift click, we need to highlight everything in the range.
  41. // Also make sure that we are actually checking checkboxes over a range and
  42. // that a checkbox has been checked or unchecked before.
  43. if (e.shiftKey && lastChecked && lastChecked != e.target) {
  44. // We use the checkbox's parent TR to do our range searching.
  45. Drupal.tableSelectRange($(e.target).closest('tr')[0], $(lastChecked).closest('tr')[0], e.target.checked);
  46. }
  47. // If all checkboxes are checked, make sure the select-all one is checked too, otherwise keep unchecked.
  48. updateSelectAll((checkboxes.length == $(checkboxes).filter(':checked').length));
  49. // Keep track of the last checked checkbox.
  50. lastChecked = e.target;
  51. });
  52. // If all checkboxes are checked on page load, make sure the select-all one
  53. // is checked too, otherwise keep unchecked.
  54. updateSelectAll((checkboxes.length == $(checkboxes).filter(':checked').length));
  55. };
  56. Drupal.tableSelectRange = function (from, to, state) {
  57. // We determine the looping mode based on the order of from and to.
  58. var mode = from.rowIndex > to.rowIndex ? 'previousSibling' : 'nextSibling';
  59. // Traverse through the sibling nodes.
  60. for (var i = from[mode]; i; i = i[mode]) {
  61. // Make sure that we're only dealing with elements.
  62. if (i.nodeType != 1) {
  63. continue;
  64. }
  65. // Either add or remove the selected class based on the state of the target checkbox.
  66. $(i).toggleClass('selected', state);
  67. $('input:checkbox', i).each(function () {
  68. this.checked = state;
  69. });
  70. if (to.nodeType) {
  71. // If we are at the end of the range, stop.
  72. if (i == to) {
  73. break;
  74. }
  75. }
  76. // A faster alternative to doing $(i).filter(to).length.
  77. else if ($.filter(to, [i]).r.length) {
  78. break;
  79. }
  80. }
  81. };
  82. })(jQuery);