SpringBoot实战项目--用户模糊查询以及分页功能实现
Posted 北林日记
tags:
篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了SpringBoot实战项目--用户模糊查询以及分页功能实现相关的知识，希望对你有一定的参考价值。
根据<from> userName(用户名)搜索...
1 <!DOCTYPE html> 2 <html class="x-admin-sm" xmlns:th="http://www.thymeleaf.org"> 3 <head> 4 <meta charset="UTF-8"> 5 <title>欢迎页面-X-admin2.2</title> 6 <header th:replace="header.html"></header> 7 </head> 8 <body class="childrenBody"> 9 <div class="x-nav"> 10 <span class="layui-breadcrumb"> 11 <a href="">用户列表</a> 12 <a> 13 <cite>【云深不知处】</cite></a> 14 </span> 15 <a class="layui-btn layui-btn-small" style="line-height:1.6em;margin-top:3px;float:right" onclick="location.reload()" title="刷新"> 16 <i class="layui-icon layui-icon-refresh" style="line-height:30px"></i></a> 17 </div> 18 <div class="layui-card-body "> 19 <div class="layui-card-header" style="display: inline"> 20 <button class="layui-btn layui-btn-danger" onclick="delAll()"><i class="layui-icon"></i>批量删除</button> 21 <button class="layui-btn" onclick="xadmin.open(\'添加用户\',\'/user/add\')"><i class="layui-icon"></i>添加</button> 22 </div> 23 24 <form class="layui-form layui-col-space5" style="display: inline"> 25 <div class="layui-inline layui-show-xs-block"> 26 <input type="text" name="userName" placeholder="请输入用户名" autocomplete="off" class="layui-input"> 27 </div> 28 <div class="layui-inline layui-show-xs-block"> 29 <button class="layui-btn" lay-submit="" lay-filter="search"><i class="layui-icon"></i></button> 30 </div> 31 </form> 32 33 <div class="layui-card-body "> 34 <table class="layui-hide" id="table" lay-filter="member"></table> 35 </div> 36 <div class="layui-card-body "> 37 <script type="text/html" id="barDemo"> 38 <a class="layui-btn layui-btn-xs" lay-event="edit" permission="sys:user:edit">编辑</a> 39 <a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="del" permission="sys:user:del">删除</a> 40 </script> 41 </div> 42 </div> 43 </body> 44 <script> 45 layui.use([\'table\'], function(){ 46 var table = layui.table; 47 form = layui.form; 48 //第一个实例 49 table.render({ 50 elem: \'#table\' 51 ,url: \'/user/list\' //数据接口 52 ,toolbar: \'#toolbarDemo\' //开启头部工具栏，并为其绑定左侧模板 53 ,page: true //开启分页 54 ,response: { 55 countName: \'count\', //规定数据总数的字段名称，默认：count 56 dataName: \'datas\' //规定数据列表的字段名称，默认：data 57 } 58 59 ,cols: [ 60 [ //表头 61 {type: \'checkbox\',fixed: \'left\'} 62 ,{field: \'id\', title: \'ID\', align:\'center\', width:60,sort: true} 63 ,{field: \'userName\', title: \'用户名\', width:80} 64 ,{field: \'nickName\', title: \'昵称\',width:120} 65 ,{field: \'sex\', title: \'性别\' ,width:75,align:\'center\',sort: true,templet:function (s) { 66 return s.sex == \'1\'?\'男\':\'女\'; 67 }} 68 ,{field: \'telephone\', title: \'手机\', width:120} 69 ,{field: \'email\', title: \'邮箱\',width:165} 70 ,{field: \'status\', title: \'状态\', width:60,align:\'center\', templet:function (d) { 71 return d.status == \'1\'?\'启动\':\'禁用\'; 72 }} 73 ,{field: \'birthday\', title: \'生日\',width:105} 74 ,{title:\'操作\', toolbar: \'#barDemo\'} 75 ] 76 ], 77 done:function() { 78 checkPermission() 79 } 80 }); 81 //监听工具条 82 table.on(\'tool(member)\', function(obj){ 83 var data = obj.data; 84 if(obj.event === \'del\'){ 85 layer.confirm(\'真的删除行么\', function(index){ 86 87 $.ajax({ 88 url:"/user/delete", 89 type:"GET", 90 data:{id:data.id}, 91 dataType:\'json\', 92 success:function(result){ 93 layer.alert("删除成功", {icon: 1},function (index1) { 94 layer.close(index1); 95 //xadmin.father_reload(); 96 table.reload(\'table\'); 97 }); 98 }, 99 }); 100 101 }); 102 } else if(obj.event === \'edit\'){ 103 xadmin.open(\'编辑用户信息\',\'/user/edit/?id=\'+data.id); 104 } 105 }); 106 107 //搜索 108 form.on(\'submit(search)\', function(data){ 109 var userName = data.field.userName; 110 table.render({ 111 elem: \'#table\' 112 ,url: \'/user/findAllByUserNamePage\'//数据接口 113 ,type:"GET" 114 ,page: true //开启分页 115 ,where:{ 116 "userName":userName 117 } 118 ,response: { 119 120 countName: \'count\', //规定数据总数的字段名称，默认：count 121 dataName: \'datas\' //规定数据列表的字段名称，默认：data 122 } 123 ,cols: [ 124 [ //表头 125 {type: \'checkbox\',fixed: \'left\'} 126 ,{field: \'id\', title: \'ID\', align:\'center\', width:60,sort: true} 127 ,{field: \'userName\', title: \'用户名\', width:80} 128 ,{field: \'nickName\', title: \'昵称\',width:120} 129以上是关于SpringBoot实战项目--用户模糊查询以及分页功能实现的主要内容，如果未能解决你的问题，请参考以下文章
个人项目实战3，springboot集成mybatis分页插件
JavaWeb SSM SpringBoot网上蛋糕商城项目12（完整源码+论文《精品毕设》）主要功能:登录注册商品浏览分类模糊查找轮播图热销商品购物车订单订单流程控制用户管理
项目实战 ---- 简单整合SpringBoot + MyBatis + Themyleaf小项目