目录
列表+添加+修改+删除(单删,批删)
页面==>Controller==>service==>Dao
一.列表的jsp页面 :
一. 想要用户已经来就看到的数据使用文档就绪函数
①文档就绪函数 :
二. 封装ajax方法
二 : 在body中间
一 : 多条件查询的文本框
二. 写列表
三.在body的下面写脚本
1.给搜索框绑定单击事件
列表+添加+修改+删除(单删,批删)
页面==>Controller==>service==>Dao
1.创建列表jsp页面
一.列表的jsp页面 :
一. 想要用户已经来就看到的数据使用文档就绪函数
①文档就绪函数 :
$(function(){
①取值 ②组装对象 ③调用ajax
})
$(function () {//取值let begin = $("#begin").val();let end=$("#end").val()//组装对象let obj={begin:begin,end:end}//调用ajaxgetUserList(obj);})
二. ②封装ajax方法
1.请求路径
2.请求方法
3.传递数据
4.解析
5.成功回调函数 :
在成功的方法里面写 :
1.清空表 2.追加表头 3.使用循环追加表数据
注意状态想要显示启用或者未启用 使用三目运算算符
//封装ajax方法function getRoleList(obj) {//ajax方法$.ajax({url:"/role/roleList", //请求路径type:"post", //请求方法data:{reqInfos:JSON.stringify(obj)}, //类型转换dataType:"json", //解析success(res){console.log(res) //打印//清空表$("#table").empty()//追加表头$("#table").append(`<tr><td><input type="checkbox" id="check"></td><td>角色表ID</td><td>角色表姓名</td><td>角色表注释</td><td>操作</td></tr>`)//循环for (let x of res) {//追加数据$("#table").append(`<tr><td><input type="checkbox" class="ck" value="\${x.roleId}"></td><td>\${x.roleId}</td><td>\${x.roleName}</td><td>\${x.roleAnnotation}</td><td><input type="button" value="修改" onclick="toUpd(\${x.roleId})"><input type="button" value="删除" onclick="del(\${x.roleId})"></td></tr>`)}},error(){alert("进入维系状态,请稍等...")}})}
二 : 在body中间
一 : 多条件查询的文本框
例 : 1.名字模糊查找 2.时间区间查找
<body>
<%--创建开始时间 结束时间--%>创建时间: <input type="datetime-local" step="1" id="begin">-<input type="datetime-local" step="1" id="end"><br>
<%--搜索按钮--%>
<input type="button" value="查询" id="seek">
<%--添加按钮--%>
<input type="button" value="添加" id="add">
<input type="button" id="delAll" value="批量删除"></body>
二. 写列表
table tr td
<%--用户对页面的查询属于后期起行为,写在body下面--%>
<%--列表--%><table id="table"><tr><td>商品创建日期</td><td>商品供应厂商</td><td>商品地址</td><td>商品状态</td><td>上传商品图片</td><td>操作</td></tr></table>
三.在body的下面写脚本
<stricp>
1.给搜索框绑定单击事件
①取值 ②组装对象 ③调用ajax
<%--给搜索框绑定单击点击事件--%>$("#seek").click(function () {//取值let begin = $("#begin").val();let end=$("#end").val()//组装对象let obj={begin:begin,end:end}//调用ajaxgetUserList(obj);})
</stricp>
Controller类 :
1.接参
2.将json对象转换为java对象
3.将转换后的对象传给service
返回值传的是 list集合 参数(对象)
4.将处理后的结果响应给用户
//全局变量 方便调用RoleServiceImpl service = new RoleServiceImpl();//列表protected void roleList(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {//接参String reqInfos = req.getParameter("reqInfos");//将JSON对象还原成Java对象Role role = JSONObject.parseObject(reqInfos, Role.class);RoleServiceImpl service = new RoleServiceImpl();//将转转换后的对象传给serviceList<Role> list=service.roleList(role);//将处理后的数据响应给用户resp.getWriter().println(JSONObject.toJSONString(list));}
service :
1.调用dao层方法
2.处理返回值
//列表@Overridepublic List<Role> roleList(Role role) {//处理返回值 调用到层方法//调用页面的ajax方法名return roleDao.getRoleList(role);}
dao层
①定义sql ②执行sql
//列表@Overridepublic List<Role> getRoleList(Role role) {//定义sqlString sql="SELECT *FROM t_role WHERE role_deleted=0";if (null!=role.getRoleName() && !role.getRoleName().isEmpty()){sql+=" and role_name like '%"+role.getRoleName()+"%' ";}System.out.println(sql); //控制台打印sql语句//执行sqlreturn baseQueryList(Role.class,sql);}