Ajax-SSM第四课 车型管理系统-全选反选批量删除功能

Posted 2022-06-01 笔触狂放

概念

本文完成批量删除功能。

功能实现

在index.html首页中，给全选按钮和反选按钮添加点击事件，实现页面中的全选和反选效果:

通过给每条数据的编号的td单元格添加class选择器，并获得这个单元格:

//定义方法，完成全选功能
        function a(obj) 
            //获得所有多选按钮
            var cks=document.getElementsByClassName("ck");
            //根据全选按钮是选中还是需要来决定所有的多选按钮是选中还是取消
            for (var i = 0; i <cks.length ; i++) 
                cks.item(i).checked=obj.checked;
            

        

其效果如下:

 

反选效果代码如下:

 //定义方法，完成反选功能
        function n() 
            //获得所有多选按钮
            var cks=document.getElementsByClassName("ck");
            //循环遍历每一个多选按钮，反选按钮每次触发这个方法，就取反
            for (var i = 0; i <cks.length ; i++) 
                cks.item(i).checked=!cks.item(i).checked;
            
        

 

 

 

给删除按钮添加点击事件

 

//定义方法，完成批量删除
        function dels() 
            //查找出被选中的多选按钮
            var cks=document.getElementsByClassName("ck");
            var tds=document.getElementsByClassName("tds");
            var str="";
            //根据选中的多选按钮找出对应的车型的编号
            for (var i = 0; i <cks.length ; i++) 
                if (cks.item(i).checked==true)
                    str+=tds.item(i).innerHTML+",";
                
            
            //将这些编号拼成字符串，发送给服务器
            location.href="del.do?ids="+str;
        

 控制器定义方法接收该请求

//定义方法，接收需要批量删除的编号
    @RequestMapping("del.do")
    public String del(@RequestParam String ids)

        int i=service.dels(ids);

        return "index.html";
    

 并将接收的大量的编号字符串发送给业务逻辑层进行业务处理分割:

int dels(String ids);

 @Override
    public int dels(String ids) 
        //去除字符串末尾的逗号
        String s = ids.substring(0, ids.length() - 1);
        //将字符串按逗号分割
        String[] split = s.split(",");
        boolean is=false;
        for (int i = 0; i <split.length ; i++) 
            int d=dao.del(Integer.parseInt(split[i]));
            if (d>0)
                is=true;
            else 
                is=false;
                break;
            
        
        return is?1:0;
    

调用dao层删除的sql操作完成批量删除

@Delete("delete from car where carId=#carId")
    int del(@Param("carId") int parseInt);

删除成功后，刷新首页页面，更新数据

总结

该批量删除功能并不是最优的效果，读者可使用触发器或者AOP面向切面编程完成批量删除功能。