bootstrap table使用小记

bootstrap table是一个非常不错的，基于bootstrap的插件，它扩展和丰富了bootstrap表格的操作，如格式化表格，表格选择器，表格工具栏，分页等等。最近基于bootstrap开发一个开台发布系统，就开发过程中，使用bootstap table遇到的一些问题及收获记录如下：开始使用：需要在你自己的页面中引入以下样式及脚本：<link rel="stylesheet" href="bootstrap.min.css">
<link rel="stylesheet" href="bootstrap-table.css"><script src="jquery.min.js"></script>
<script src="bootstrap.min.js"></script>
<script src="bootstrap-table.js"></script>https://github.com/wenzhixin/bootstrap-table/一、Bootstrap table 支持超多列，会自动显示水平滚动条。我们用bootstrap开发，经常会遇到一个头疼的问题，如果客户要求表格中显示的列较多，无论我们用bootstrap的哪种布局方式，显示效果都不尽人意。Bootstap table很好的协处理了这个问题，使我们能够在不改变原有的布局方式的情况下，很好的处理超多列的问题，而且支持自定义显示列名，效果如下：

$("#gridSystemModal .btn-primary").click(function () {
var selectRow = $("#table-ShipChk").bootstrapTable('getSelections');

if (selectRow.length < 1) {
selectRow = $table.bootstrapTable('getSelections');
if (selectRow.length < 1){
alert("请先选择船舶！");
return;
}
}
$("#SHIP_NAME").val(selectRow[0][1].trim());
$("#VOYAGE_NO").val(selectRow[0][3].trim());
$("#SHIP_NM_EN").val(selectRow[0][2].trim());
$("#DOCK_BTH_NM").val(selectRow[0][4].trim());
$("#ARR_DT").val(selectRow[0][5].trim());
$("#gridSystemModal").modal('hide');
});

获取选中的数据行
But，意外发生了，就算我把那个选择按钮点破了，也选不中我要的数据。Why???为什么，为什么。。查官方文档，就是一名$("#table-ShipChk").bootstrapTable('getSelections')搞定的事，为什么在我这就搞不定了，度娘，GG一无所获。用Bootstrap Table的初衷，就是它简单，强大呀，怎么会这样呢，好吧，加班，查查查。。问题就出在，每次ajax请求数据后，我都是返回一个新的分部视图去替换原有的分部视图，替换后没有把Bootstrap Table启动起来，别人还在睡大觉呢，你怎么‘getSelections’，它都不鸟你。好吧，在ajax success中补它一刀：$("#table-ShipChk").bootstrapTable();好了，Bootstrap Table醒了，我可以下班了。未完，无续。。