bootstrap-table学习

中文文档

http://bootstrap-table.wenzhixin.net.cn/zh-cn/documentation/

注意点

1.对bootstrap的version有要求

2.bootstrap-table 是异步请求。（踩过坑）

例子：https://blog.csdn.net/qq897558368/article/details/52064810（很详细，不会就看API）

bootstrap-table的option事件和jQuery事件对于参数row的影响

option事件的row是当前行数据

jQuery事件的row数据

$("#serverTable").bootstrapTable({
                url:'/DcBaseInfoCompanyGis/getTableByName',  //获取表格数据
                contentType:'application/x-www-form-urlencoded; charset=UTF-8',//使用post传参，去掉后无法成功
                method: "get",
                toolbar:"#serverToolbar",
                cache: false,            //禁用ajax缓存
                striped: true,           //表格显示条纹
                pagination: true,        //在底部显示分页组件
                pageList: [10, 20],       //设置页面可以显示的数据条数
                pageSize: 10,             // 页面数据条数
                pageNumber: 1,            // 首页页码
                sidePagination: 'server', // 设置为服务器端分页
                showColumns:true,        //是否显示内容列下拉框
                showToggle:false,         //切换详细视图和列表视图
                singleSelect:true,        //单选checkbox
                queryParamsType: '',
                queryParams:function (params){   //请求服务器数据时，添加额外参数
                    return {
                        pageSize:params.pageSize, // 每页要显示的数据条数
                        pageNum:params.pageNumber,    // 页码
                        name:$("#name").val()
                    }
                },
                //onCheck属性附上function函数
                onCheck:function (row) {
                    document.returnValue = {text:row.name, value:row.id, type:0} ;
                },
                idField:'id',             //指定主键列
                columns:[{
                    checkbox: true,   //显示一个勾选框
                    align: 'center'   //居中显示
                },{
                    field:'name',  //返回json中的name
                    title:'服务企业名称',   //表格表头显示文字
                    halign:'center',
                    //align:'center',   //左右居中
                    valign: 'middle' // 上下居中
                },{
                    field:'address',  //返回json中的name
                    title:'企业地址',   //表格表头显示文字
                    halign:'center',
                    // align:'center',   //左右居中
                    valign: 'middle' // 上下居中
                }
                ]
            });