bootstrap table加载数据
//html
<table ></table>
//js
$(function () { initTable(); }); function initTable() { var oTable = new TableInit(); oTable.Init(); } var TableInit = function () { var oTableInit = new Object(); //初始化Table oTableInit.Init = function () { $('#dailyDevTable').bootstrapTable('destroy'); $('#dailyDevTable').bootstrapTable({ url: '/daily/dailyDev/getDailyList',//请求后台的URL(*) method: 'get', //请求方式(*) striped: true, //是否显示行间隔色 cache: false, //是否使用缓存,默认为true(*) pagination: true, //是否显示分页(*) queryParams: oTableInit.queryParams,//传递参数(*) sidePagination: "server", //分页方式:client客户端分页,server服务端分页(*) pageSize: 10, //每页的记录行数(*) columns: [{ checkbox: true }, { field: 'dailyId', visible: false //隐藏列 }, { field: 'userId', visible: false },{ field: 'dailyName', title: '日报名称' }, { field: 'deptName', title: '部门名称' }, { field: 'userName', title: '填报人' }, { field: 'otherinfo', title: '日报内容', width: '40%' }, { field: 'operate', title: '操作', formatter: operateFormatter //自定义方法,添加操作按钮 }, ] }); }; //得到查询的参数 oTableInit.queryParams = function (params) { var args = { //这里的键的名字和控制器的变量名必须一致 limit: params.limit, //页面大小 offset: params.offset //页码 }; return args; }; return oTableInit; }; function operateFormatter(value, row, index) {//赋予的参数 return [ '<a class="btn btn-success btn-sm" ' + 'onclick="initVisit(\''+row.userId+'\',\''+row.dailyName+'\',\''+row.dailyId+'\')">' + '<i class="fa fa-clone"></i></a>' ].join(''); } //查看详细 function initVisit(userId,dailyName,dailyId){ //todo }
//java
@GetMapping("/getDevData") @ResponseBody public PageUtils getDevData(int limit,int offset){ List<Map<String,Object>> list = new ArrayList<>(); for (int i = 1; i <= limit; i++) { Map<String,Object> map = new HashMap<>(); map.put("dailyName","日报名称"+Integer.toString(offset+i)); map.put("deptName","部门名称"+Integer.toString(offset+i)); map.put("userName","填报人"+Integer.toString(offset+i)); map.put("otherInfo","日报内容"+Integer.toString(offset+i)); list.add(map); } PageUtils pageUtils = new PageUtils(list,100); return pageUtils; } //返回分页查询数据类 public class PageUtils implements Serializable { private static final long serialVersionUID = 1L; private int total; private List<?> rows; public PageUtils(List<?> list, int total) { this.rows = list; this.total = total; } public int getTotal() { return total; } public void setTotal(int total) { this.total = total; } public List<?> getRows() { return rows; } public void setRows(List<?> rows) { this.rows = rows; } }