浏览代码

Add editable extension.

zhixin 11 年之前
父节点
当前提交
8561fcc4c1
共有 2 个文件被更改,包括 86 次插入0 次删除
  1. 25 0
      src/extensions/editable/README.md
  2. 61 0
      src/extensions/editable/bootstrap-table-editable.js

+ 25 - 0
src/extensions/editable/README.md

@@ -0,0 +1,25 @@
+# Table Editable
+
+Use Plugin: [x-editable](https://github.com/vitalets/x-editable)
+
+## Usage
+
+```html
+<script src="extensions/editable/bootstrap-table-editable.js"></script>
+```
+
+## Options
+
+### editable
+
+* type: Boolean
+* description: Set false to disabled editable of all columns.
+* default: `true`
+
+## Column options
+
+### editable
+
+* type: Object
+* description: Configuration of x-editable. Full list of options: http://vitalets.github.io/x-editable/docs.html#editable
+* default: `undefined`

+ 61 - 0
src/extensions/editable/bootstrap-table-editable.js

@@ -0,0 +1,61 @@
+/**
+ * @author zhixin wen <wenzhixin2010@gmail.com>
+ * extensions: https://github.com/vitalets/x-editable
+ */
+
+!function($) {
+
+    'use strict';
+
+    $.extend($.fn.bootstrapTable.defaults, {
+        editable: false
+    });
+
+    var BootstrapTable = $.fn.bootstrapTable.Constructor,
+        _initTable = BootstrapTable.prototype.initTable,
+        _initBody = BootstrapTable.prototype.initBody;
+
+    BootstrapTable.prototype.initTable = function () {
+        var that = this;
+        _initTable.apply(this, Array.prototype.slice.apply(arguments));
+
+        if (!this.options.editable) {
+            return;
+        }
+
+        $.each(this.options.columns, function (i, column) {
+            if (!column.editable) {
+                return;
+            }
+
+            var _formatter = column.formatter;
+            column.formatter = function (value, row, index) {
+                var result = _formatter ? _formatter(value, row, index) : value;
+
+                return ['<a href="javascript:void(0)"',
+                    ' data-name="' + column.field + '"',
+                    ' data-pk="' + row[that.options.idField] + '"',
+                    '>' + result + '</a>'
+                ].join('');
+            };
+        });
+    };
+
+    BootstrapTable.prototype.initBody = function () {
+        var that = this;
+        _initBody.apply(this, Array.prototype.slice.apply(arguments));
+
+        if (!this.options.editable) {
+            return;
+        }
+
+        $.each(this.options.columns, function (i, column) {
+            if (!column.editable) {
+                return;
+            }
+
+            that.$body.find('a[data-name="' + column.field + '"]').editable(column.editable);
+        });
+    };
+
+}(jQuery);