IDEA 搭建 基于 SSM 框架 的 Maven 项目 （9）

此系列：IDEA 搭建 基于 SSM 框架 的 Maven 项目， 完成一个基本的Web应用，实现 crud 功能。

(1) 在IDEA中，新建一个Maven工程，并创建好完整的项目结构
(2) 引入项目依赖的 jar 包，引入bootstrap前端框架，编写SSM整合的配置文件
(3) 创建数据库，生成bean文件 和 mapper文件，最后测试该部分
(4) 页面发送请求查询所有员工数据，得到 json 字符串
(5) 设计分页显示页面，解析 json 字符串，展示查询结果
(6) 添加“新增”功能
(7) 对用户输入数据进行校验
(8) 添加“修改”功能
(9) 添加“删除”功能

本节：添加“删除”功能

---

1. 单条删除

(1) EmployeeService 中，添加员工删除方法

	/**
	 * 员工删除
	 * @param id
	 */
	public void deleteEmp(Integer id) {
		// TODO Auto-generated method stub
		employeeMapper.deleteByPrimaryKey(id);
	}

(2) EmployeeController中，添加处理删除员工请求的方法

	@ResponseBody
    @RequestMapping(value="/emp/{id}",method=RequestMethod.DELETE)
    public Msg deleteEmp(@PathVariable("id")Integer id){
        employeeService.deleteEmp(id);
        return Msg.success();
    }

(3) 为删除按钮，绑定删除事件

	 	//单个删除
        $(document).on("click",".delete_btn",function(){
            //1、弹出是否确认删除对话框
            var empName = $(this).parents("tr").find("td:eq(2)").text();
            var empId = $(this).attr("del-id");
            if(confirm("确认删除【"+empName+"】吗？")){
                //确认，发送ajax请求删除即可
                $.ajax({
                    url:"${APP_PATH}/emp/"+empId,
                    type:"DELETE",
                    success:function(result){
                        alert(result.msg);
                        //回到本页
                        to_page(currentPage);
                    }
                });
            }
        });

2. 完成 “全选，全不选” 功能

(1) 为总选择框，添加点击事件

		//完成全选/全不选功能
		$("#check_all").click(function(){
			//attr获取checked是undefined;
			//我们这些dom原生的属性；attr获取自定义属性的值；
			//prop修改和读取dom原生属性的值
			$(".check_item").prop("checked",$(this).prop("checked"));
		});

(2) 为单个选择框，添加点击事件

		//check_item
		$(document).on("click",".check_item",function(){
			//判断当前选择中的元素是否5个
			var flag = $(".check_item:checked").length==$(".check_item").length;
			$("#check_all").prop("checked",flag);
		});

3. 批量删除

(1) 为删除按钮，添加id

<button class="btn btn-danger" id="emp_delete_all_btn">删除</button>

(2) 为删除按钮，添加点击事件

		//点击全部删除，就批量删除
		$("#emp_delete_all_btn").click(function(){
			//
			var empNames = "";
			var del_idstr = "";
			$.each($(".check_item:checked"),function(){
				//this
				empNames += $(this).parents("tr").find("td:eq(2)").text()+",";
				//组装员工id字符串
				del_idstr += $(this).parents("tr").find("td:eq(1)").text()+"-";
			});
			//去除empNames多余的,
			empNames = empNames.substring(0, empNames.length-1);
			//去除删除的id多余的-
			del_idstr = del_idstr.substring(0, del_idstr.length-1);
			if(confirm("确认删除【"+empNames+"】吗？")){
				//发送ajax请求删除
				$.ajax({
					url:"${APP_PATH}/emp/"+del_idstr,
					type:"DELETE",
					success:function(result){
						alert(result.msg);
						//回到当前页面
						to_page(currentPage);
					}
				});
			}
		});

(3) 修改EmployeeController中，添加处理删除员工请求的方法，使得可以批量处理

	@ResponseBody
	@RequestMapping(value="/emp/{ids}",method=RequestMethod.DELETE)
	public Msg deleteEmp(@PathVariable("ids")String ids){
		//批量删除
		if(ids.contains("-")){
			List<Integer> del_ids = new ArrayList<>();
			String[] str_ids = ids.split("-");
			//组装id的集合
			for (String string : str_ids) {
				del_ids.add(Integer.parseInt(string));
			}
			employeeService.deleteBatch(del_ids);
		}else{
			Integer id = Integer.parseInt(ids);
			employeeService.deleteEmp(id);
		}
		return Msg.success();
	}

(4) EmployeeService 中，添加员工批量删除方法

	public void deleteBatch(List<Integer> ids) {
        // TODO Auto-generated method stub
        EmployeeExample example = new EmployeeExample();
        EmployeeExample.Criteria criteria = example.createCriteria();
        //delete from xxx where emp_id in(1,2,3)
        criteria.andEmpIdIn(ids);
        employeeMapper.deleteByExample(example);
    }

---

终