bootstrapTable 插件使用注意点

样例


$('#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方法!!!

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值