爱站程序员基地类似局部刷新数据，常用与搜索框的使用，刷新查找的数据
官方文档参考
运行效果参考: 数据表格的重载HTML
<div class=\"form-box\"><div class=\"layui-form layui-form-item\"><div class=\"layui-inline\"><div class=\"layui-input-inline\" style=\"width: 200px;\"><input type=\"text\" name=\"search\" autocomplete=\"off\" class=\"layui-input\" placeholder=\"查询信息\"></div><button class=\"layui-btn layui-btn-blue\" id=\"searchContext\">查询</button><button class=\"layui-btn layui-btn-primary\" id=\"clearContext\">重置</button></div></div><button class=\"layui-btn layui-btn-blue\" id=\"addNew\"><i class=\"layui-icon\"></i>新增</button><table class=\"layui-hide\" id=\"demo\" lay-filter=\"rol\"></table></div>
JS
<script>layui.use(\'table\', function() {var table = layui.table;table.render({elem: \'#demo\', method: \'get\', url: \'/findUser\', cellMinWidth: 35 //全局定义常规单元格的最小宽度，layui 2.2.1 新增, toolbar: false, cols: [[{field: \'userId\', title: \'ID\', sort: true}, {field: \'userName\', title: \'用户名\'} //width 支持：数字、百分比和不填写。你还可以通过 minWidth 参数局部定义当前单元格的最小宽度，layui 2.2.1 新增, {field: \'createTime\', title: \'创建时间\', templet: \'#dateTpl\',sort: true}, {field: \'school\', title: \'所属学校\', sort: true}, {field: \'major\', title: \'所属专业\', sort: true}, {field: \'action\', title: \'操作\', toolbar: \'#barDemo\'}]], page: true, page: {//支持传入 laypage 组件的所有参数（某些参数除外，如：jump/elem） - 详见文档layout: [\'count\', \'prev\', \'page\', \'next\', \'skip\'] //自定义分页布局, limit: 5, groups: 2 //只显示 1 个连续页码, first: false //不显示首页, last: false //不显示尾页}});table.on(\'tool(rol)\', function(obj) {var checkStatus = obj.data.userId;if (obj.event === \'del\') {$.ajax({type:\"get\",url: \"/deleteUser\",data:{\"userId\":checkStatus},success:function () {layer.msg(\"删除成功\",{time:2000},function () {window.location.reload();});}});}});});$(\'#searchContext\').click(function () {var te = $(\'input[name=search]\').val();if (te===\'\'||te==null){$(\'input[name=search]\').val(\"\").focus();layer.msg(\"请输入搜索信息\")}else {var table = layui.table;table.reload(\'demo\', {url: \'/searchUser\',where: {\"message\":te} //设定异步数据接口的额外参数//,height: 300});}});</script>
后台
@ResponseBody@GetMapping(\"/searchUser\")public String searchUser(@RequestParam(defaultValue = \"1\",required =true)Integer page,HttpServletRequest req){String message = req.getParameter(\"message\");PageHelper.startPage(page,5);List<User> userList = backstageService.findSearch(message);PageInfo<User>pageInfo = new PageInfo<>(userList);JSONObject jsonObject = new JSONObject();jsonObject.put(\"code\",0);//成功的状态码，默认：0jsonObject.put(\"msg\", \"\");jsonObject.put(\"count\",userList.size());jsonObject.put(\"data\",pageInfo.getList());return jsonObject.toJSONString();}
