bootstrap-table-editable.js 3.7 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107
  1. /**
  2. * @author zhixin wen <wenzhixin2010@gmail.com>
  3. * extensions: https://github.com/vitalets/x-editable
  4. */
  5. !function ($) {
  6. 'use strict';
  7. $.extend($.fn.bootstrapTable.defaults, {
  8. editable: true,
  9. onEditableInit: function () {
  10. return false;
  11. },
  12. onEditableSave: function (field, row, oldValue, $el) {
  13. return false;
  14. },
  15. onEditableShown: function (field, row, $el, editable) {
  16. return false;
  17. },
  18. onEditableHidden: function (field, row, $el, reason) {
  19. return false;
  20. }
  21. });
  22. $.extend($.fn.bootstrapTable.Constructor.EVENTS, {
  23. 'editable-init.bs.table': 'onEditableInit',
  24. 'editable-save.bs.table': 'onEditableSave',
  25. 'editable-shown.bs.table': 'onEditableShown',
  26. 'editable-hidden.bs.table': 'onEditableHidden'
  27. });
  28. var BootstrapTable = $.fn.bootstrapTable.Constructor,
  29. _initTable = BootstrapTable.prototype.initTable,
  30. _initBody = BootstrapTable.prototype.initBody;
  31. BootstrapTable.prototype.initTable = function () {
  32. var that = this;
  33. _initTable.apply(this, Array.prototype.slice.apply(arguments));
  34. if (!this.options.editable) {
  35. return;
  36. }
  37. $.each(this.columns, function (i, column) {
  38. if (!column.editable) {
  39. return;
  40. }
  41. var _formatter = column.formatter;
  42. column.formatter = function (value, row, index) {
  43. var result = _formatter ? _formatter(value, row, index) : value;
  44. return ['<a href="javascript:void(0)"',
  45. ' data-name="' + column.field + '"',
  46. ' data-pk="' + row[that.options.idField] + '"',
  47. ' data-value="' + result + '"',
  48. '>' + '</a>'
  49. ].join('');
  50. };
  51. });
  52. };
  53. BootstrapTable.prototype.initBody = function () {
  54. var that = this;
  55. _initBody.apply(this, Array.prototype.slice.apply(arguments));
  56. if (!this.options.editable) {
  57. return;
  58. }
  59. $.each(this.columns, function (i, column) {
  60. if (!column.editable) {
  61. return;
  62. }
  63. that.$body.find('a[data-name="' + column.field + '"]').editable(column.editable)
  64. .off('save').on('save', function (e, params) {
  65. var data = that.getData(),
  66. index = $(this).parents('tr[data-index]').data('index'),
  67. row = data[index],
  68. oldValue = row[column.field];
  69. row[column.field] = params.submitValue;
  70. that.trigger('editable-save', column.field, row, oldValue, $(this));
  71. });
  72. that.$body.find('a[data-name="' + column.field + '"]').editable(column.editable)
  73. .off('shown').on('shown', function (e, editable) {
  74. var data = that.getData(),
  75. index = $(this).parents('tr[data-index]').data('index'),
  76. row = data[index];
  77. that.trigger('editable-shown', column.field, row, $(this), editable);
  78. });
  79. that.$body.find('a[data-name="' + column.field + '"]').editable(column.editable)
  80. .off('hidden').on('hidden', function (e, reason) {
  81. var data = that.getData(),
  82. index = $(this).parents('tr[data-index]').data('index'),
  83. row = data[index];
  84. that.trigger('editable-hidden', column.field, row, $(this), reason);
  85. });
  86. });
  87. this.trigger('editable-init');
  88. };
  89. }(jQuery);