springboot + ajax + mybatis 实现批量删除

时间:2023-03-09 16:22:51
springboot + ajax + mybatis 实现批量删除

实现思路:

  1. checkbox全选获取批量删除的id数组

  2. ajax以字符串的形式将id数组传给控制器

  3. 控制器将字符串分割成List数组作为参数传给mapper

具体代码:

  1. 前端代码

<table>
<thead>
<tr>
<th>#</th>
<th>id</th>
<th>文件名</th>
<th>文件类型</th>
<th>上传时间</th>
<th>上传用户</th>
<th>文件大小</th>
</tr>
</thead>
<tbody>
<tr th:each="resource:${resources}">
<td>
<input type="checkbox" name="checkId" id="checkId" th:value="${resource.id}"/>
</td>
<td th:text="${resource.id}">Row 1 Data 1</td>
<td th:text="${resource.fileName}">Row 1 Data 2</td>
<td th:text="${resource.fileType}">Row 1 Data 1</td>
<td th:text="${resource.fileTime}">Row 1 Data 2</td>
<td th:text="${resource.fileUploader}">Row 1 Data 1</td>
<td th:text="${resource.fileSize}">Row 1 Data 2</td>
</tr>
</tbody>
</table><br>
<input type="checkbox" name="selectAll" id="selectAll" onclick="selectAll(this);">全选&emsp;
<button type="button" onclick="deleteLogic();">批量删除</button>

  2. js代码

/**
* checkbox全选/全不全
* @param checkbox
*/
function selectAll(checkbox) {
$('input[name="checkId"]').prop('checked', $(checkbox).prop('checked'));
} /**
* 批量删除
*/
function deleteLogic() { var checkNum = $("input[name='checkId']:checked").length; if(checkNum==0){
alert("至少选择一项");
return;
} if(confirm("确定要删除吗?")){
var checkList = new Array();
$("input[name='checkId']:checked").each(function () {
checkList.push($(this).val())
});
} $.ajax({
url:"/deleteAll",
type:"post",
data:{
checkList:checkList.toString()
},
datatype:"json",
success:function (data) {
location.reload();
alert("删除成功!")
},
error:function (msg) {
alert("删除失败!")
}
})
}

  3. Controller代码

@PostMapping("/deleteAll")
@ResponseBody
public String deleteAll(String checkList){ System.out.println("==>"+checkList); String[] strs = checkList.split(",");
List<Integer> ids = new ArrayList<>(); for(String str:strs){
ids.add(Integer.parseInt(str));
} resourcesService.deleteAll(ids); return "success";
}

  4. mapper.xml代码

<delete id="deleteAll" parameterType="list">
delete from resources where id in
<foreach collection="list" item="id" open="(" close=")" separator=",">
#{id}
</foreach>
</delete>