实现思路:

  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>

  

springboot + ajax + mybatis 实现批量删除的更多相关文章

  1. Mybatis实现批量删除数据

    Mybatis实现批量删除操作 学习内容: 1. 使用 2. 代码实现 2.1 UserMapper.java 接口 2.2 UserMapper.xml 总结: 学习内容: 1. 使用 这里通过动态 ...

  2. mybatis的批量删除

    公司工程用的是Mybatis的example的类,自动生成了对数据库的操作,批量操作的今天用到了,两种方式,一种需要拓展它生成的类,另一种自带的. 批量删除的id是以集合List传递 id以List& ...

  3. (后端)Mybatis实现批量删除操作(转)

    原文地址:https://blog.csdn.net/javaee_sunny/article/details/52511842 一. 这里主要考虑两种参数类型:数组或者集合. 而这点区别主要体现在E ...

  4. mybatis springmvc批量删除 2最新

    service层: @Override public void batchDeletes(List list) { creditDao.batchDeletes(list); } 控制层control ...

  5. 使用Ajax实现的批量删除操作(C#)

    今天做了一个简单的批量删除操作,虽然简单,但是很多问题出现,终究还是技术不够熟练. 现在在这里跟大家分享一下.仅供学习... 1.在前台获取用户点击的信息id,把这里id封装到一个数组里面:(rows ...

  6. mybatis的批量删除操作

    需求描述:将符合某条件的几条记录删除 解决思路:对于多个id,可以使用sql关键词 in ,只要满足数据库的id在你的id集合或者list中,就删除,从而实现批量删除.循环delete方法是在是low ...

  7. Mybatis实现批量删除

    知识点:当传入参数为数组时,XX.xml文件中,标签为collection属性 参考博客:https://blog.csdn.net/javaee_sunny/article/details/5251 ...

  8. mybatis postgresql 批量删除

    一.需求介绍 前端是一个列表页面,列表可以进行复选框的选择,后台进行关联表数据的删除. 二.框架介绍 springboot+mybatis 数据库用的postgresql 三.具体代码(前端js) 1 ...

  9. Mybatis批量删除之Error code 1064, SQL state 42000;

    (一)小小的一次记载. (二):最近的项目都是使用MyBatis,批量新增自己都会写了,但是一次批量删除可把我给折腾了下,写法网上都有,但是照着做就是不行,最后问公司的人,问网友才得到答案,那就是jd ...

随机推荐

  1. JAVA并发工具类---------------(Fork/Join)

    Fork/Join 分而治之 将一个大任务分成数个小任务执行,然后将这些小人物执行后的结果进行join汇总: (假设:你要计算1到1000的总和,你可以把它分成1-100,101-200,...... ...

  2. mybatis 丢失字段

    实体上,如果没写get,记得加上 @Data

  3. ES6十大特性(转载CSDN)

    1. const和let关键字 const用于定义常量. let用于定义变量.但是JavaScript中不是已经有变量了吗? 是的,这很正确,但用var声明的变量具有函数作用域,并会被提升到顶部. 这 ...

  4. java xmltojson jsontoxml

    JSONObject.fromObject需要的有额外的6个包,必不可少,一定要注意: commons-beanutils-1.9.2.jar      commons-collections-3.2 ...

  5. UVA 356 - Square Pegs And Round Holes

    题目:在一个2n*2n的网格中间画一个直径为2n-1的圆,问圆内部的格子以及和圆相交的格子个数. 思路:只要考虑1 / 4圆的点就行,用点到原点距离与半径比较,当格子左下方和右上方都在格子里时,格子在 ...

  6. 拾遗:关于“尾递归”- tail recursion

    定义[个人理解]: 尾递归,即是将外层得出的常量计算因子,以函数参数的形式逐层向内传递,即内层调用整合外层调用的产出,整个递归的结果最终由最内层的一次函数调用得出:而通常的递归则是外层调用阻塞.等待内 ...

  7. 【二】Jmeter接口自动化测试系列之函数使用及扩展

    上一篇文章我们了解了Jmeter的参数化的集中方法,虽然方法不是很多,但已经足够使用! 本篇文章,介绍一下Jmeter自带函数的使用和 函数扩展,来满足测试工作中的各种需求! Jmeter自带函数 点 ...

  8. VSCode 中文乱码

    方式一 vscode 菜单栏:  文件 >> 首选项 >> 设置 搜索: "files.autoGuessEncoding": false, 改为: &qu ...

  9. [已解决]报错This event loop is already running

    安装nest_asyncio pip install nest_asyncio 导入并调用 import nest_asyncio nest_asyncio.apply()

  10. python学习9—文件基本操作与高级操作

    python学习9—文件基本操作与高级操作 1. 文件基本操作 打开文件,获得文件句柄:f = open('filename',encoding='utf-8'),open会查询操作系统的编码方式,并 ...