diff --git a/src/extensions/treegrid/README.md b/src/extensions/treegrid/README.md
new file mode 100644
index 0000000000..06891a2e0a
--- /dev/null
+++ b/src/extensions/treegrid/README.md
@@ -0,0 +1,23 @@
+# Table Treegrid
+
+Use Plugin: [bootstrap-table-treegrid](https://github.com/wenzhixin/bootstrap-table/tree/master/src/extensions/treegrid)
+
+## Usage
+
+```html
+<script src="extensions/treegrid/bootstrap-table-treegrid.js"></script>
+```
+
+## Options
+
+### treeShowField
+
+* type: String
+* description: 
+* default: ``
+
+### parentIdField
+
+* type: String
+* description: 
+* default: `pid`
diff --git a/src/extensions/treegrid/bootstrap-table-treegrid.js b/src/extensions/treegrid/bootstrap-table-treegrid.js
new file mode 100644
index 0000000000..476d406a18
--- /dev/null
+++ b/src/extensions/treegrid/bootstrap-table-treegrid.js
@@ -0,0 +1,95 @@
+/**
+ * @author: YL
+ * @version: v1.0.0
+ */
+!function ($) {
+    'use strict';
+    $.extend($.fn.bootstrapTable.defaults, {
+        treeShowField: null,
+        idField: 'id',
+        parentIdField: 'pid',
+        onGetNodes: function (row, data) {
+            var that = this;
+            var nodes = [];
+            $.each(data, function (i, item) {
+                if (row[that.options.idField] === item[that.options.parentIdField]) {
+                    nodes.push(item);
+                }
+            });
+            return nodes;
+        },
+        onCheckRoot: function (row, data) {
+            var that = this;
+            return !row[that.options.parentIdField];
+        }
+    });
+
+    var BootstrapTable = $.fn.bootstrapTable.Constructor,
+        _initRow = BootstrapTable.prototype.initRow,
+        _initHeader = BootstrapTable.prototype.initHeader;
+
+    // td
+    BootstrapTable.prototype.initHeader = function () {
+        var that = this;
+        _initHeader.apply(that, Array.prototype.slice.apply(arguments));
+        var treeShowField = that.options.treeShowField;
+        if (treeShowField) {
+            $.each(this.header.fields, function (i, field) {
+                if (treeShowField === field) {
+                    that.treeEnable = true;
+                    return false;
+                }
+            });
+        }
+    };
+
+    var initTr = function (item, idx, data, parentDom) {
+        var that = this;
+        var nodes = that.options.onGetNodes.apply(that, [item, data]);
+        item._nodes = nodes;
+        parentDom.append(_initRow.apply(that, [item, idx, data, parentDom]));
+
+        // init sub node
+        var len = nodes.length - 1;
+        for (var i = 0; i <= len; i++) {
+            var node = nodes[i];
+            node._level = item._level + 1;
+            node._parent = item;
+            if (i === len)
+                node._last = 1;
+            // jquery.treegrid.js
+            that.options.rowStyle = function (item, idx) {
+                var id = item[that.options.idField] ? item[that.options.idField] : 0;
+                var pid = item[that.options.parentIdField] ? item[that.options.parentIdField] : 0;
+                return {
+                    classes: 'treegrid-' + id + ' treegrid-parent-' + pid
+                };
+            };
+            initTr.apply(that, [node, $.inArray(node, data), data, parentDom]);
+        }
+    };
+
+    // tr
+    BootstrapTable.prototype.initRow = function (item, idx, data, parentDom) {
+        var that = this;
+        if (that.treeEnable) {
+            // init root node
+            if (that.options.onCheckRoot.apply(that, [item, data])) {
+                if (item._level === undefined) {
+                    item._level = 0;
+                }
+                // jquery.treegrid.js
+                that.options.rowStyle = function (item, idx) {
+                    var x = item[that.options.idField] ? item[that.options.idField] : 0;
+                    return {
+                        classes: 'treegrid-' + x
+                    };
+                };
+                initTr.apply(that, [item, idx, data, parentDom]);
+                return true;
+            }
+            return false;
+        }
+        return _initRow.apply(that, Array.prototype.slice.apply(arguments));
+    };
+}(jQuery);
\ No newline at end of file
diff --git a/src/extensions/treegrid/demo.png b/src/extensions/treegrid/demo.png
new file mode 100644
index 0000000000..c262911b8b
Binary files /dev/null and b/src/extensions/treegrid/demo.png differ
diff --git a/src/extensions/treegrid/extension.json b/src/extensions/treegrid/extension.json
new file mode 100644
index 0000000000..2c07e1f487
--- /dev/null
+++ b/src/extensions/treegrid/extension.json
@@ -0,0 +1,17 @@
+{
+  "name": "treegrid",
+  "version": "1.0.0",
+  "description": "Plugin to support the jquery treegrid.",
+  "url": "https://github.com/wenzhixin/bootstrap-table/tree/master/src/extensions/treegrid",
+  "example": "https://github.com/wenzhixin/bootstrap-table-examples/blob/master/extensions/treegrid.html",
+
+  "plugins": [{
+    "name": "bootstrap-table-treegrid",
+    "url": "https://github.com/wenzhixin/bootstrap-table/tree/master/src/extensions/treegrid"
+  }],
+
+  "author": {
+    "name": "foreveryang321",
+    "image": "https://avatars0.githubusercontent.com/u/5868190"
+  }
+}
\ No newline at end of file