bootstrap-table-reorder-columns.js 3.2 KB

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