首页 > 代码库 > bootstrap datatable
bootstrap datatable
<table id="screenTable" data-toggle="table"> <thead> ... </thead> </table> $(function () { $(‘#screenTable‘).bootstrapTable({ url: "/screen/list", dataField: "rows", cache: false, //是否使用缓存,默认为true striped: true, //是否显示行间隔色 pagination: true, //是否显示分页 pageSize: 10, //每页的记录行数 pageNumber: 1, //初始化加载第一页,默认第一页 pageList: [10, 20, 50], //可供选择的每页的行数 search: true, //是否显示表格搜索 showRefresh: true, //是否显示刷新按钮 clickToSelect: true, //是否启用点击选中行 toolbar: "#toolbar_screen", //工具按钮用哪个容器 sidePagination: "server", //分页方式:client客户端分页,server服务端分页 queryParamsType: "limit", //查询参数组织方式 columns: [{ field: "id", title: "ID", align: "center", valign: "middle" }, { field: "name", title: "定制名称", align: "center", valign: "middle", formatter: ‘infoFormatter‘ }, { field: "time", title: "定制时间", align: "center", valign: "middle" },
{
title: ‘操作‘,
field: ‘operation‘,
align: ‘middle‘,
formatter:function(value,row){
alluserLisr.push(row);
return ‘<div class="ui-pg-div">‘+
‘<a href="javascript:void(0)" title="编辑" class="ui-icon icon-pencil grey" onclick="popedit(‘+row.id+‘);">编辑</a> ‘+
‘<a href="javascript:void(0)" title="删除" class="ui-icon icon-remove grey" onclick="popalert(‘+row.id+‘);">删除</a> ‘+
‘</div>‘;
}
}
], formatNoMatches: function () { return ‘无符合条件的记录‘; } }); $(window).resize(function () { $(‘#screenTable‘).bootstrapTable(‘resetView‘);//当页面缩放时 将表格缩放 响应式 }); }); function infoFormatter(value, row, index) { return ‘<a href=http://www.mamicode.com/screen/‘ + row.id + ‘ target="_blank">‘ + row.name + ‘</a>‘; }
bootstrap datatable
声明:以上内容来自用户投稿及互联网公开渠道收集整理发布,本网站不拥有所有权,未作人工编辑处理,也不承担相关法律责任,若内容有误或涉及侵权可进行投诉: 投诉/举报 工作人员会在5个工作日内联系你,一经查实,本站将立刻删除涉嫌侵权内容。