相关文章索引：

1. 使用Bootstrap-Table实现分页和排序
2. 使用Bootstrap-Table实现行折叠

在需要展示的数据量比较大的时候，一般需要将表格的行进行折叠，bootstrap-table其实是支持这种需求的，具体的例子可以参见http://issues.wenzhixin.net.cn/bootstrap-table/#methods/expandRow-collapseRow.html。折叠的截图如下：

但是，由于之前将Bootstrp-table进行了改造，使用加载片段的方式实现数据异步加载，如果使用原生的API就无法实现折叠了。通过分析最终的HTML代码可以看到：

列表新增了一列，用来显示折叠行所用的“+”和“-”图标：

折叠的一行其实就是合并了单元格的隐藏行，通过JS脚本控制显隐：

分析到这里，实现起来就不复杂了，样式是现成的，只需要在原先不需要折叠的基础上增加所需的单元格和JS脚本而已。所以只需要以下几步就可以：

1. 列头增加新的一列，如下所示：

2. 主体内容新增加一列，用来显示折叠标记，如下所示：

3. 紧随上面增加一行，用来显示需要折叠的内容(注意colsplan的值)，如下所示：

4. 增加一个JS脚本，用来控制折叠内容的显隐：

最后的效果如下：