1.引入 layui 的配置文件
2.java代码
@RequestMapping("select")
@ResponseBody
public Map select(int page,@RequestParam("limit") int Size){
PageInfo<City> pi = cs.selectAll(page, Size);
Map map = new HashMap<>();
map.put("code",0); //layui自定义响应码,为0时成功
map.put("msg",""); //额外的响应信息,没有可以不写
map.put("count",pi.getTotal()); //当前查询结果的总条数
map.put("data", pi.getList()); //存储表格中要展示的数据,
return map;
}
3.写jsp
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
<title>Title</title>
<link rel="stylesheet" href="${pageContext.request.contextPath}/layui/css/layui.css">
<script src="${pageContext.request.contextPath}/layui/layui.js"></script>
</head>
<body>
<table id="demo" class="layui-icon"></table>
<script>
//第一个参数:引入需要使用的模块
//第二个参数:匿名函数,写我们要执行的layui的js代码
layui.use("table", function () {
//定义一个变量,存储layer模块
var table = layui.table;
table.render({
elem: "#demo", //表格id
//height:500, //表格高度
limit: 5, //默认值
limits: [1, 5, 10], //设置每页显示几条
url: "${pageContext.request.contextPath}/select.do", // 请求路径
page: true, //是否分页
cols: [[ //表格参数
{field: "id", title: "ID"},
{field: "code", title: "代码"},
{field: "name", title: "名称"},
{field: "provinceid", title: "上级"},
]]
})
})
</script>
</body>
</html>