样例
$('#table').bootstrapTable({
url : "/island/admin/queryAllNews.do",
method : "post", //请求方式
toolbar: '#toolbar', //工具按钮用哪个容器
dataType : "json", //返回的是json对象
striped: true, //是否显示行间隔色
pageList: [10, 25, 50, 100], //可供选择的每页的行数(*)
search: false, //显示搜索框
showColumns: true, //是否显示所有的列
showRefresh: true, //是否显示刷新按钮
showExport: true, //是否显示导出
exportDataType: "all", //basic', 'all', 'selected'.
search: true, //是否显示表格搜索,此搜索是客户端搜索,不会进服务端,所以,个人感觉意义不大
strictSearch: true,
pagination: true, //是否显示分页(*)
sidePagination: "client", //分页方式:client客户端分页,server服务端分页(*)
pageNumber:1, //初始化加载第一页,默认第一页
pageSize: 6, //每页的记录行数(*)
clickToSelect: true, //是否启用点击选中行
uniqueId: "ID", //每一行的唯一标识,一般为主键列
showToggle:true, //是否显示详细视图和列表视图的切换按钮
cardView: false, //是否显示详细视图
undefinedText:"后台数据出错!",
searchOnEnterKey:true, //设置为 true时,按回车触发搜索方法
clickToSelect:true, //设置true 将在点击行时,自动选择rediobox 和 checkbox
rowStyle: function (row, index) { //设置每行的样式
//这里有5个取值代表5中颜色['active', 'success', 'info', 'warning', 'danger'];
var strclass = "";
if (row.statement == "发布") {
strclass = '#ccc';//还有一个active
}
else {
return {};
}
return { css: {"background":strclass}}
},
columns: [{
checkbox:true
}, {
field: 'title', //filed的名字必须与字段名字相对应才可以自动填充list
title: '新闻标题',
align: "center" //文本居中模式
}, {
field: 'releasetime',
title: '新闻发布日期',
align: "center",
formatter:function(value,row,index){
return [
value.substring(0,19)
];
}
},{
field: 'content',
title: '新闻内容',
align: "center",
class:'hidden-phone'
},{
field: 'categoryname',
title: '新闻种类',
align: "center",
class:'hidden-phone'
},{
field: 'author',
title: '新闻作者',
align: "center"
},{
field: 'covercontent',
title: '封面内容',
align: "center"
},{
field: 'coverimage',
title: '封面图片',
align: "center",
class:'hidden-phone',
formatter: function(value,row,index){ //对于当前列进行处理显示
return [
"<a href='"+value+"' class='index_image' data-lightbox='example-set' title='新闻封面大图'>" +
"<img src='"+value+"' width='100px'/></a>",
];
}
}]
});
这里有一点需要注意的是 如果像上述这样返回的是json数据 那么只需要field属性对应实体类的属性即可 但是必须要有get方法!!!