bootstrap-table-reorder-columns.js 3.7 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121
  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. $.extend($.fn.bootstrapTable.defaults, {
  9. reorderableColumns: false,
  10. maxMovingRows: 10,
  11. onReorderColumn: function (headerFields) {
  12. return false;
  13. },
  14. dragaccept: null
  15. });
  16. $.extend($.fn.bootstrapTable.Constructor.EVENTS, {
  17. 'reorder-column.bs.table': 'onReorderColumn'
  18. });
  19. var BootstrapTable = $.fn.bootstrapTable.Constructor,
  20. _initHeader = BootstrapTable.prototype.initHeader,
  21. _toggleColumn = BootstrapTable.prototype.toggleColumn,
  22. _toggleView = BootstrapTable.prototype.toggleView,
  23. _resetView = BootstrapTable.prototype.resetView;
  24. BootstrapTable.prototype.initHeader = function () {
  25. _initHeader.apply(this, Array.prototype.slice.apply(arguments));
  26. if (!this.options.reorderableColumns) {
  27. return;
  28. }
  29. this.makeRowsReorderable();
  30. };
  31. BootstrapTable.prototype.toggleColumn = function () {
  32. _toggleColumn.apply(this, Array.prototype.slice.apply(arguments));
  33. if (!this.options.reorderableColumns) {
  34. return;
  35. }
  36. this.makeRowsReorderable();
  37. };
  38. BootstrapTable.prototype.toggleView = function () {
  39. _toggleView.apply(this, Array.prototype.slice.apply(arguments));
  40. if (!this.options.reorderableColumns) {
  41. return;
  42. }
  43. if (this.options.cardView) {
  44. return;
  45. }
  46. this.makeRowsReorderable();
  47. };
  48. BootstrapTable.prototype.resetView = function () {
  49. _resetView.apply(this, Array.prototype.slice.apply(arguments));
  50. if (!this.options.reorderableColumns) {
  51. return;
  52. }
  53. this.makeRowsReorderable();
  54. };
  55. BootstrapTable.prototype.makeRowsReorderable = function () {
  56. var that = this;
  57. try {
  58. $(this.$el).dragtable('destroy');
  59. } catch (e) {}
  60. $(this.$el).dragtable({
  61. maxMovingRows: that.options.maxMovingRows,
  62. dragaccept: that.options.dragaccept,
  63. clickDelay:200,
  64. beforeStop: function() {
  65. var ths = [],
  66. formatters = [],
  67. columns = [],
  68. columnsHidden = [],
  69. columnIndex = -1;
  70. that.$header.find('th').each(function (i) {
  71. ths.push($(this).data('field'));
  72. formatters.push($(this).data('formatter'));
  73. });
  74. //Exist columns not shown
  75. if (ths.length < that.columns.length) {
  76. columnsHidden = $.grep(that.columns, function (column) {
  77. return !column.visible;
  78. });
  79. for (var i = 0; i < columnsHidden.length; i++) {
  80. ths.push(columnsHidden[i].field);
  81. formatters.push(columnsHidden[i].formatter);
  82. }
  83. }
  84. for (var i = 0; i < ths.length; i++ ) {
  85. columnIndex = $.fn.bootstrapTable.utils.getFieldIndex(that.columns, ths[i]);
  86. if (columnIndex !== -1) {
  87. columns.push(that.columns[columnIndex]);
  88. that.columns.splice(columnIndex, 1);
  89. }
  90. }
  91. that.columns = that.columns.concat(columns);
  92. that.header.fields = ths;
  93. that.header.formatters = formatters;
  94. that.resetView();
  95. that.trigger('reorder-column', ths);
  96. }
  97. });
  98. };
  99. }(jQuery);