bootstrap-table-reorder-columns.js 5.9 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181
  1. /**
  2. * @author: Dennis Hernández
  3. * @webSite: http://djhvscf.github.io/Blog
  4. * @version: v1.1.0
  5. */
  6. !function ($) {
  7. 'use strict';
  8. //From MDN site, https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/filter
  9. var filterFn = function () {
  10. if (!Array.prototype.filter) {
  11. Array.prototype.filter = function(fun/*, thisArg*/) {
  12. 'use strict';
  13. if (this === void 0 || this === null) {
  14. throw new TypeError();
  15. }
  16. var t = Object(this);
  17. var len = t.length >>> 0;
  18. if (typeof fun !== 'function') {
  19. throw new TypeError();
  20. }
  21. var res = [];
  22. var thisArg = arguments.length >= 2 ? arguments[1] : void 0;
  23. for (var i = 0; i < len; i++) {
  24. if (i in t) {
  25. var val = t[i];
  26. // NOTE: Technically this should Object.defineProperty at
  27. // the next index, as push can be affected by
  28. // properties on Object.prototype and Array.prototype.
  29. // But that method's new, and collisions should be
  30. // rare, so use the more-compatible alternative.
  31. if (fun.call(thisArg, val, i, t)) {
  32. res.push(val);
  33. }
  34. }
  35. }
  36. return res;
  37. };
  38. }
  39. };
  40. $.extend($.fn.bootstrapTable.defaults, {
  41. reorderableColumns: false,
  42. maxMovingRows: 10,
  43. onReorderColumn: function (headerFields) {
  44. return false;
  45. },
  46. dragaccept: null
  47. });
  48. $.extend($.fn.bootstrapTable.Constructor.EVENTS, {
  49. 'reorder-column.bs.table': 'onReorderColumn'
  50. });
  51. var BootstrapTable = $.fn.bootstrapTable.Constructor,
  52. _initHeader = BootstrapTable.prototype.initHeader,
  53. _toggleColumn = BootstrapTable.prototype.toggleColumn,
  54. _toggleView = BootstrapTable.prototype.toggleView,
  55. _resetView = BootstrapTable.prototype.resetView;
  56. BootstrapTable.prototype.initHeader = function () {
  57. _initHeader.apply(this, Array.prototype.slice.apply(arguments));
  58. if (!this.options.reorderableColumns) {
  59. return;
  60. }
  61. this.makeRowsReorderable();
  62. };
  63. BootstrapTable.prototype.toggleColumn = function () {
  64. _toggleColumn.apply(this, Array.prototype.slice.apply(arguments));
  65. if (!this.options.reorderableColumns) {
  66. return;
  67. }
  68. this.makeRowsReorderable();
  69. };
  70. BootstrapTable.prototype.toggleView = function () {
  71. _toggleView.apply(this, Array.prototype.slice.apply(arguments));
  72. if (!this.options.reorderableColumns) {
  73. return;
  74. }
  75. if (this.options.cardView) {
  76. return;
  77. }
  78. this.makeRowsReorderable();
  79. };
  80. BootstrapTable.prototype.resetView = function () {
  81. _resetView.apply(this, Array.prototype.slice.apply(arguments));
  82. if (!this.options.reorderableColumns) {
  83. return;
  84. }
  85. this.makeRowsReorderable();
  86. };
  87. BootstrapTable.prototype.makeRowsReorderable = function () {
  88. var that = this;
  89. try {
  90. $(this.$el).dragtable('destroy');
  91. } catch (e) {}
  92. $(this.$el).dragtable({
  93. maxMovingRows: that.options.maxMovingRows,
  94. dragaccept: that.options.dragaccept,
  95. clickDelay:200,
  96. beforeStop: function() {
  97. var ths = [],
  98. formatters = [],
  99. columns = [],
  100. columnsHidden = [],
  101. columnIndex = -1,
  102. optionsColumns = [];
  103. that.$header.find('th').each(function (i) {
  104. ths.push($(this).data('field'));
  105. formatters.push($(this).data('formatter'));
  106. });
  107. //Exist columns not shown
  108. if (ths.length < that.columns.length) {
  109. columnsHidden = $.grep(that.columns, function (column) {
  110. return !column.visible;
  111. });
  112. for (var i = 0; i < columnsHidden.length; i++) {
  113. ths.push(columnsHidden[i].field);
  114. formatters.push(columnsHidden[i].formatter);
  115. }
  116. }
  117. for (var i = 0; i < ths.length; i++ ) {
  118. columnIndex = $.fn.bootstrapTable.utils.getFieldIndex(that.columns, ths[i]);
  119. if (columnIndex !== -1) {
  120. that.columns[columnIndex].fieldIndex = i;
  121. columns.push(that.columns[columnIndex]);
  122. that.columns.splice(columnIndex, 1);
  123. }
  124. }
  125. that.columns = that.columns.concat(columns);
  126. filterFn(); //Support <IE9
  127. $.each(that.columns, function(i, column) {
  128. var found = false,
  129. field = column.field;
  130. that.options.columns[0].filter(function(item) {
  131. if(!found && item["field"] == field) {
  132. optionsColumns.push(item);
  133. found = true;
  134. return false;
  135. } else
  136. return true;
  137. })
  138. });
  139. that.options.columns[0] = optionsColumns;
  140. that.header.fields = ths;
  141. that.header.formatters = formatters;
  142. that.initHeader();
  143. that.initToolbar();
  144. that.initBody();
  145. that.resetView();
  146. that.trigger('reorder-column', ths);
  147. }
  148. });
  149. };
  150. }(jQuery);