实现批量删除功能

项目中对数据进行管理时，往往会用到批量删除对数据进行快速操作。

主要使用thymeleaf模板引擎，jQuery，ajax，SpringBoot框架，前端采用bootstrap框架

1.thymeleaf中部分代码

    
    工号
    姓名
    性别
    出生日期
    民族
    电话
    操作

         //为全选和全部选绑定事件
         $("#check_all").click(function () {
             $(".check_item").prop("checked",$("#check_all").prop("checked"));
         })

         //check_item
         $(document).on("click",".check_item",function () {
              if($(".check_item:checked").length==$(".check_item").length){
                  $("#check_all").prop("checked",true);
              }else {
                  $("#check_all").prop("checked",false);
              }
         })

          //批量删除绑定事件
          $("#btn_delete").click(function () {
              var tchId="";
              $.each($(".check_item:checked"),function (i,item) {
                  tchId+="tchId="+$(item).val()+"&";
              })
              tchId=tchId.substring(0,tchId.length-1)
              $.ajax({
                  url:,
                  data:tchId,
                  type:"post",
                  success:function (result) {
                     alert("删除成功")
                  }
              })
          })

      //1.解析并显示员工信息
      function build_table(result) {
         var html='';
         var teachers=result.list;
         $.each(teachers,function (index,item) {
          html+='';
          html+='';
          html+=''+item.number+'';
          html+=''+item.tchName+'';
          html+=''+item.tchGender+'';
          html+=''+item.tchBirthday+'';
          html+=''+item.tchNation+'';
          html+=''+item.tchTel+'';
          html+='';
          html+='';
          html+='编辑';
          html+='';
          html+=' ';
          html+='';
          html+='删除';
          html+='';
          html+=' ';
          html+='';
          html+='详情';
          html+='';
          html+='';
          html+='';
          html+='';
          })
          $("#tch_table").html(html);
      }

因为class为check_item的复选框是动态生成的，所有不能使用$(".check_item").click()来绑定单击事件，所有需要使用下面代码来绑定事件

$(document).on("click",".check_item",function () {
              if($(".check_item:checked").length==$(".check_item").length){
                  $("#check_all").prop("checked",true);
              }else {
                  $("#check_all").prop("checked",false);
              }
         })

2.controller层

@RequestMapping("/deleteTchs")
@ResponseBody
public Map deleteTechs(@RequestParam("tchId") List tchIds){
      Map map=new HashMap<>();
    int num=teacherService.delete(tchIds);
    if (num>0){
        map.put("message",200);
    }else {
        map.put("message",500);
    }
    return map;
}

3.mapper文件

  delete from teacher
  where tch_id in 
  
    #{item}