bootstrap-table-multiple-selection-row.js 4.5 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127
  1. /**
  2. * @author: Dennis Hernández
  3. * @webSite: http://djhvscf.github.io/Blog
  4. * @version: v1.0.0
  5. */
  6. !function ($) {
  7. 'use strict';
  8. document.onselectstart = function() {
  9. return false;
  10. };
  11. var getTableObjectFromCurrentTarget = function (currentTarget) {
  12. currentTarget = $(currentTarget);
  13. return currentTarget.is("table") ? currentTarget : currentTarget.parents().find(".table");
  14. };
  15. var getRow = function (target) {
  16. target = $(target);
  17. return target.parent().parent();
  18. };
  19. var onRowClick = function (e) {
  20. var that = getTableObjectFromCurrentTarget(e.currentTarget);
  21. if (window.event.ctrlKey) {
  22. toggleRow(e.currentTarget, that, false, false);
  23. }
  24. if (window.event.button === 0) {
  25. if (!window.event.ctrlKey && !window.event.shiftKey) {
  26. clearAll(that);
  27. toggleRow(e.currentTarget, that, false, false);
  28. }
  29. if (window.event.shiftKey) {
  30. selectRowsBetweenIndexes([that.bootstrapTable("getOptions").multipleSelectRowLastSelectedRow.rowIndex, e.currentTarget.rowIndex], that)
  31. }
  32. }
  33. };
  34. var onCheckboxChange = function (e) {
  35. var that = getTableObjectFromCurrentTarget(e.currentTarget);
  36. clearAll(that);
  37. toggleRow(getRow(e.currentTarget), that, false, false);
  38. };
  39. var toggleRow = function (row, that, clearAll, useShift) {
  40. if (clearAll) {
  41. row = $(row);
  42. that.bootstrapTable("getOptions").multipleSelectRowLastSelectedRow = undefined;
  43. row.removeClass(that.bootstrapTable("getOptions").multipleSelectRowCssClass);
  44. that.bootstrapTable("uncheck", row.data("index"));
  45. } else {
  46. that.bootstrapTable("getOptions").multipleSelectRowLastSelectedRow = row;
  47. row = $(row);
  48. if (useShift) {
  49. row.addClass(that.bootstrapTable("getOptions").multipleSelectRowCssClass);
  50. that.bootstrapTable("check", row.data("index"));
  51. } else {
  52. if(row.hasClass(that.bootstrapTable("getOptions").multipleSelectRowCssClass)) {
  53. row.removeClass(that.bootstrapTable("getOptions").multipleSelectRowCssClass)
  54. that.bootstrapTable("uncheck", row.data("index"));
  55. } else {
  56. row.addClass(that.bootstrapTable("getOptions").multipleSelectRowCssClass);
  57. that.bootstrapTable("check", row.data("index"));
  58. }
  59. }
  60. }
  61. };
  62. var selectRowsBetweenIndexes = function (indexes, that) {
  63. indexes.sort(function(a, b) {
  64. return a - b;
  65. });
  66. for (var i = indexes[0]; i <= indexes[1]; i++) {
  67. toggleRow(that.bootstrapTable("getOptions").multipleSelectRowRows[i-1], that, false, true);
  68. }
  69. };
  70. var clearAll = function (that) {
  71. for (var i = 0; i < that.bootstrapTable("getOptions").multipleSelectRowRows.length; i++) {
  72. toggleRow(that.bootstrapTable("getOptions").multipleSelectRowRows[i], that, true, false);
  73. }
  74. };
  75. $.extend($.fn.bootstrapTable.defaults, {
  76. multipleSelectRow: false,
  77. multipleSelectRowCssClass: 'multiple-select-row-selected',
  78. //internal variables used by the extension
  79. multipleSelectRowLastSelectedRow: undefined,
  80. multipleSelectRowRows: []
  81. });
  82. var BootstrapTable = $.fn.bootstrapTable.Constructor,
  83. _init = BootstrapTable.prototype.init,
  84. _initBody = BootstrapTable.prototype.initBody;
  85. BootstrapTable.prototype.init = function () {
  86. if (this.options.multipleSelectRow) {
  87. var that = this;
  88. //Make sure that the internal variables have the correct value
  89. this.options.multipleSelectRowLastSelectedRow = undefined;
  90. this.options.multipleSelectRowRows = [];
  91. this.$el.on("post-body.bs.table", function (e) {
  92. setTimeout(function () {
  93. that.options.multipleSelectRowRows = that.$body.children();
  94. that.options.multipleSelectRowRows.click(onRowClick);
  95. that.options.multipleSelectRowRows.find("input[type=checkbox]").change(onCheckboxChange);
  96. }, 1);
  97. });
  98. }
  99. _init.apply(this, Array.prototype.slice.apply(arguments));
  100. };
  101. BootstrapTable.prototype.clearAllMultipleSelectionRow = function () {
  102. clearAll(this);
  103. };
  104. $.fn.bootstrapTable.methods.push('clearAllMultipleSelectionRow');
  105. }(jQuery);