java实现多选批量删除功能
本文为大家分享了java实现多选批量删除的具体代码，帮助大家更好的理解批量删除功能的实现过程，供大家参考，具体内容如下
本文用到的框架是：springmvc+mybatis
实现思路:多选复选框多个删除,点击全选全部选中,再次点击全部取消,为了保证操作的安全,应该提示框进行提升,用户再次点击确认删除进行删除,把选中的多个复选框的值传到后端进行循环删除,最后刷新数据,公司中为了保证数据安全一般不会真正删除而是把数据修改状态进行隐藏,也就是修改,这边以完全删除为例
部分效果截图(页面简陋)
点击全选
再次点击全选
删除提示
确认删除
代码部分,含有简单单个删除
（1）controller
@RequestMapping("/batchDeletes")
//批量删除
public String delAnimal(String ids){
List<String> delList = new ArrayList<String>();
String[] strs = ids.split(",");
for (String str : strs) {
delList.add(str);
}
//开始循环批量删除
testService.batchDeletes(delList);
//重定向刷新数据
return "redirect:/showAnimal";
}
@RequestMapping("/delByID")
public String delByID(int id){
testService.delByID(id);
//重定向刷新数据
return "redirect:/showAnimal";
}
代码思路：
从前台勾选的选择框中传过来的值用“，”分开，然后遍历存放到delList集合里面，直接删delList集合里面的所有字符串。
(2)service
void batchDeletes(List delList); void delByID(int id);
(3)serviceImpl
@Override
public void batchDeletes(List delList) {
testDao.batchDeletes(delList);
}
@Override
public void delByID(int id) {
testDao.delByID(id);
}
(4)dao
void batchDeletes(List delList); void delByID(int id);
(5)mapper.xml
<!--批量删除 -->
<delete id="batchDeletes" parameterType="java.util.List">
delete from animal where id in
<!--循环删除 -->
<foreach collection="list" index="index" item="item" open="(" separator="," close=")">
#{item}
</foreach>
</delete>
<delete id="delByID" parameterType="int">
delete from animal where id=#{id}
</delete>
如上的mybatis指代的意思如下：
foreach元素的属性主要有 item，index，collection，open，separator，close。
item表示集合中每一个元素进行迭代时的别名. （直接找到对应的delList集合里面的所有元素，item="item"中的item(后一个)必须与#{item} 中的item一致）
index指 定一个名字，用于表示在迭代过程中，每次迭代到的位置.
open表示该语句以什么开始，separator表示在每次进行迭代之间以什么符号作为分隔 符.
close表示以什么结束.
前端页面代码
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%--
Created by IntelliJ IDEA.
User: wx_weiyihe
Date: 2021/8/24
Time: 14:45
To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<script src="https://code.jquery.com/jquery-3.1.1.min.js"></script>
<html>
<head>
<title>Title</title>
</head>
<body>
<input type="button" value="批量删除" id="deleteButton">
<table border="1px" cellspacing="0px">
<tr>
<th align="center">
<input type="checkbox" id="SelectAll" onclick="selectAll();" /> 全选</th>
<th>ID</th>
<th>名称</th>
<th>年龄</th>
<th>操作</th>
</tr>
<c:forEach items="${list}" var="animal">
<tr>
<td align="center"><input type="checkbox" name="checkbox" value="${animal.id}"></td>
<td>${animal.id}</td>
<th>${animal.name}</th>
<th>${animal.age}</th>
<th><input type="button" value="删除" onclick="delByID('${animal.id}')"></th>
</tr>
</c:forEach>
</table>
</body>
<script>
//全选(全不选)
function selectAll(){
//如果选择全选按钮
if ($("#SelectAll").is(":checked")) {
$(":checkbox").prop("checked", true);//所有选择框都选中
} else { //如果没有选择全选按钮
$(":checkbox").prop("checked", false); //全部不选中
}
}
//批量删除
$("#deleteButton").on("click", function() {
//判断至少写了一项
var checkedNum = $("input[name='checkbox']:checked").length;
if (checkedNum == 0) {
alert("请至少选择一项!");
return false;
}
//创建数组,存储选择的id
var checkedList = new Array();
$("input[name='checkbox']:checked").each(function () {
//把当前选中的复选框的id存入数组中
checkedList.push($(this).val());
});
//提示删除
var flag=confirm("确认要删除这"+checkedList.length+"条数据吗?")
if(flag){
//传参,后端继续进行删除操作,传到后端的是一个String数组
window.location.href="http://localhost:8080/batchDeletes?ids=" rel="external nofollow" +checkedList;
}
})
//单个删除
function delByID(id){
window.location.href="http://localhost:8080/delByID?id=" rel="external nofollow" +id
}
</script>
</html>
以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持我们。
相关推荐
-
Java 批量删除html中注释内容的方法
其实删除html文本中的注释有很多方法,这里就自己随便写了一个处理方法,权当笔记,有需要的同学可以参考. html文本的注释有几个特点: 1. 成对出现,有开始就一定有结束. 2. 注释标签没有嵌套,注释开始标签(以下称为 <!--)下一个一定是其对应的结束标签(以下称为 -->). 3. 一行中可能有多个注释标签对儿. 4. 注释也可以换行. 大致有以下几种情况: 复制代码 代码如下: <html> <!--This is a head--> <head&g
-
vue+element+Java实现批量删除功能
表格的主要代码段 主要方法是: @selection-change="selsChange <el-table ref="singleTable" v-loading="loading" :data="tableData" stripe @selection-change="selsChange"> <el-table-column type="selection" width=
-
Java 批量删除Word中的空白段落示例代码
1. 测试文档.期望达到的目标文档效果 用于测试的Word文档如下所示,包含的空白段落影响文章整体布局及美观性: 目标文档效果: 2. 辅助工具 2.1 使用类库:Free Spire.Doc for Java(免费版) 2.2 类库jar导入(2种导入方法供参考): ①. 通过官网下载jar包,解压,手动将lib文件夹下的Spire.Doc.jar导入java程序: ②. Maven程序中导入jar需先配置pom.xml文件,然后导入程序,如下配置: <repositories> <r
-
Java实现多选批量删除功能（vue+Element）
本文实例为大家分享了Java实现多选批量删除功能的具体代码,供大家参考,具体内容如下 选择前效果图 选中效果图 前端vue代码 1.页面显示template 使用方法 @selection-change="changeFun" 获取表中选中的行所有显示的数据 <template> <div class="dept tab-container"> <div class="dept-table"> <div
-
Java实现多选批量删除功能(vue+Element)
本文实例为大家分享了Java实现多选批量删除功能的具体代码,供大家参考,具体内容如下 选择前效果图 选中效果图 前端vue代码 1.页面显示template 使用方法 @selection-change="changeFun" 获取表中选中的行所有显示的数据 <template> <div class="dept tab-container"> <div class="dept-table"> <div
-
java实现多选批量删除功能
本文为大家分享了java实现多选批量删除的具体代码,帮助大家更好的理解批量删除功能的实现过程,供大家参考,具体内容如下 本文用到的框架是:springmvc+mybatis 实现思路:多选复选框多个删除,点击全选全部选中,再次点击全部取消,为了保证操作的安全,应该提示框进行提升,用户再次点击确认删除进行删除,把选中的多个复选框的值传到后端进行循环删除,最后刷新数据,公司中为了保证数据安全一般不会真正删除而是把数据修改状态进行隐藏,也就是修改,这边以完全删除为例 部分效果截图(页面简陋) 点击全选
-
PHP jQuery+Ajax结合写批量删除功能
为了美观,我还是引入了bootstrap的模态框,我引入的是自己的数据库 library中的一张表 名为:maninfo表 是一张个人信息表 表的加载我就不写了,比较简单, 大概写一下需要的按钮和html部分就可以了 <button type="button" class="btn btn-primary" id="plscdz" >批量删除</button> 全选: <input type="check
-
vue+element实现批量删除功能的示例
今年开始学习vue+element实现后台开发,在实现批量删除功能时有2个小知识点记录在下: 1.如何实现单击行交替选中当前行的复选框,element官网的table实例中没有找到.--通过row-click和toggleRowSelection实现 2.如何获取选中行的值来实现批量删除.--通过selection-change实现 代码如下 html: <div class="row mt30 pl15"> <el-button type="warning
-
Laravel框架实现的批量删除功能示例
本文实例讲述了Laravel框架实现的批量删除功能.分享给大家供大家参考,具体如下: 1.HTML的内容 <tr> <th><input type="checkbox" class="checkbox-inline" onclick="checkAll(this)"></th> // 用来全选 </tr> </thead> <tbody> @foreach ($k
-
PHP ajax+jQuery 实现批量删除功能实例代码小结
目录结构 piliangshan.php <?php require_once './db_conn.php'; $sql = "select * from user"; $result = mysqli_query($conn, $sql); ?> <html lang="zh-CN"> <head> <meta charset="UTF-8"> <title>全选演示</tit
-
vue+element的表格实现批量删除功能示例代码
最近写了一个批量删除功能,遇到了不少坑,特此记录一下 表格的代码如下 复制代码 代码如下: <el-table @row-click="handleCurrentChange" @selection-change="selsChange" ref="table" :data="pageData" stripe :default-sort="{prop: 'createAt', order: 'descendin
-
jQuery+Datatables实现表格批量删除功能【推荐】
Datatables是一款jquery表格插件.它是一个高度灵活的工具,可以将任何HTML表格添加高级的交互功能. 最近遇到这样的需求要求把表格批量删除.下面通过实例代码给大家介绍下. 1:点击全选的选择框CheckBox,选中以下列表中所有的选择框 2:再次点击全选的选择框CheckBox,不选中以下列表中所有的选择框 3:单选某个选择框 如图所示: http://recordit.co/GLj5a5BWo9 简单代码demo: <thead> <tr role="row&q