一 : 删除没有单独的页面,在列表页面写
二 : 删除在列表的页面
1.删除(单/双)的按钮
① : 在列表文档就绪函数的ajax里面,成功回调函数追加数据里写删除按钮
注意点 : 删除/修改/回显都是根据id来的,记得传id
② : 批删给批删按钮,定义批删的方法
one : 示例(单删) :
//循环追加表数据 for (let x of arr) { $("#table").append(` <tr> <td> <input type="checkbox" class="ck" value="\${x.userId}"> </td> <td>\${x.userId}</td> <td>\${x.userName}</td> <td>\${x.userState==0?'启用':'禁用'}</td> <td> <img src="/file/showImg?imgUrl=\${x.imgUrl}" alt="" height="100" width="75"> </td> <td>\${x.userDel}</td> <td>\${x.userTime}</td> <td> <input type="button" value="删除" onclick="delOne(\${x.userId})"> <input type="button" value="修改" onclick="userUpd(\${x.userId})"> </td> /tr> `) }
tow : 示例(批删按钮)
<%--批删按钮--%> <input type="button" value="批删" onclick="delAll()">
2.给(单删)绑定js事件
① : 先判断
② : 添加友情提示 : 弹出确认删除的警告框
③ : ajax
删除走的是路径传参,不用写请求方式,传id
删除成功走200,刷新,回列表页面
示例 :
/** * 单删 */ function delOne(userId) { //判断 if (!userId){ alert("请先输入") //结束 return } if (confirm("确定要删除吗")){ //ajax $.ajax({ url:"/user/userDel?userId="+userId, type:"post", dataType: "json", success(res) { console.log(res) if (res===200){ //刷新 location.reload() alert("删除成功") //跳转页面 location.href="list.jsp" } } }) } }
3.给(批删)写js事件
① : 定义数组
② : 获取选中的复选框
③ : 获取选中复选框的值
④ : 添加进数组里
⑤ : 将数组转换成字符串
⑥ : 调用单删的方法
//批删 function delAll() { //定义数组 let arr=[]; //获取选中的复选框 $(".ck:checked").each(function () { //获取被选中的复选框的值 let userId =$(this).val() //添加进数组里 arr.push(userId) }) //将数组转字符串 let s = arr.join(","); //调用单删除方法 delOne(s) }
4.全选/全不选
//全选/全不选 $(document).on('click',"#check",function () { $('.ck').prop("checked",this.checked) })
三 : 删除的Controller
1. 接参 : 接路径传参传过来的id
2. 传给service 带着id传过去
3. 响应 200
注意点 : 单删/批删走一个Controller,写一个就可以了
示例 :
/** * 删除 */ protected void userDel(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException { //接参 String userId = req.getParameter("userId"); //传给service service.userDel(userId); //响应 resp.getWriter().println(JSONObject.toJSONString(200)); }
四 : 删除service层
1.调用dao层方法,处理返回值 (单/批走一个service)
/** * 删除 * @param userId */ @Override public void userDel(String userId) { //调用方法 userDao.userDel(userId); }
五 : dao层
1.定义sql 2.执行sql
① : 单删的sql语句
/** * 删除 * @param userId */ @Override public void userDel(String userId) { //定义sql in ("+userId+") String sql="UPDATE t_user SET user_del=1 WHERE user_id=? "; //打印 System.out.println(sql); //执行sql baseUpdate(sql,userId); }
② : 批删的sql语句
/** * 删除 * @param userId */ @Override public void userDel(String userId) { //定义sql String sql="UPDATE t_user SET user_del=1 WHERE user_id in ("+userId+") "; //打印 System.out.println(sql); //执行sql baseUpdate(sql); }