基于ssm使用ajax实现批量删除

此次批量删除是在上一篇博客上进行功能的添加，详情请看：https://blog.csdn.net/qq_40718312/article/details/96310016
在上一次中，实现了权限登录，这次运用ajax实现批量删除。我们知道AJAX = Asynchronous JavaScript and XML（异步的 JavaScript 和 XML），其最大的优点是在不重新加载整个页面的情况下，可以与服务器交换数据并更新部分网页内容，这样就可以减少资源的浪费。

1.修改原界面
原用户列表页面是这样的

需要在左上角显示登陆后的用户名，并在右上角实现退出功能
①显示用户名和退出功能的实现
在aside.jsp添加

<%@taglib prefix="security" uri="http://www.springframework.org/security/tags" %>

并修改部分代码为

						
						  用户管理
					
						
					

在header.jsp中添加

<%@taglib prefix="security" uri="http://www.springframework.org/security/tags" %>

修改

		class="user-image" alt="User Image"> 
					
				
					

为

class="user-image" alt="User Image"> 
					
					
				
					

并修改

								注销

②修改页面的刷新按钮为批量删除

在user-list.jsp中把

											 刷新
										

改成

button type="button" class="btn btn-default" title="批量删除"
											  onclick="deleteAll()">
											 批量删除
										

修改

 
										
											
											${userInfos.id}

为

在这里插入代码片

 
										
											
											${userInfos.id}

这样界面修改基本完成


2.运用ajax实现批量删除
添加js包
链接：https://pan.baidu.com/s/1pPTKcfHs94JimSQbpRzVNg
提取码：8819
解压后复制到webapp中
①在IUserInfoDao中添加

void deleteAll(List ids);

在UserInfoMapper.xml中添加

 
        delete from userinfo where id in
        
        #{id}
        
    

这是实现在数据库中批量删除数据

②在IUserInfoService中添加

 void deleteAll(List list);

在UserInfoServiceImpl中实现它

 @Override
    public void deleteAll(List list) {
        userInfoDao.deleteAll(list);
    }

③在UserInfoController中添加

 @RequestMapping("deleteAll.do")
    @ResponseBody
    public String deleteAll(String userList){
        String [] strs=userList.split(",");
        List ids=new ArrayList<>();
        for(int i=0;i

然后在user-list.jsp中添加

这样也就实现了ajax的批量删除功能



到这里，就实现了使用ajax实现批量删除