SSM学习第五天：AJAX+批量删除

AJAX的用途很广，比如登录注册的时候，又或者这次要讲的批量删除。使用AjAX可以在一定程度上保证项目的性能。

1.导入所需的js文件

2.在前端页面中加载js文件

<script type="text/javascript" src="${pageContext.request.contextPath}/js/jquery-3.2.1.min.js"></script>

3.修改前端

<button type="button" class="btn btn-default" title="删除"  onclick="deleteAll()">
			<i class="fa fa-refresh"></i> 删除
</button>

<td><input name="ids" type="checkbox" value="${userInfos.id}"></td>

4.AJAX

<script type="text/javascript" src="${pageContext.request.contextPath}/js/jquery-3.2.1.min.js"></script>
	<script type="text/javascript">
		function deleteAll() {
		    var checkNum=$("input[name='ids']:checked").length;
		    if(checkNum==0){
		        alert("请至少选择一项");
		        return;
			}
			if(confirm("确定要删除吗？")){
			    var userList=new Array();
			    $("input[name='ids']:checked").each(function () {
					userList.push($(this).val())
                });
			}
			$.ajax({
				type:"post",
				url:"${pageContext.request.contextPath}/user/deleteAll.do",
				data:{userList:userList.toString()},
				success:function () {
					alert("删除成功！");
					location.reload();
                },
                error:function () {
				    alert("删除失败！");
                }
			})
			
        }
</script>

对于

url:"${pageContext.request.contextPath}/user/deleteAll.do",

下面对其进行deleteAll.do操作

5.Controller层

@RequestMapping("deleteAll")
    @ResponseBody
    public String deleteAll(String userList){
        String[] strs=userList.split(",");
        List<Integer> ids = new ArrayList<>();
        for(int i=0;i<strs.length;i++){
            ids.add(Integer.parseInt(strs[i]));
        }
        iUserInfoService.deleteAll(ids);
        return "";
    }

6.service层

public void deleteAll(List<Integer> ids){
        iUserInfoDao.deleteAll(ids);
}

7.Dao层

public void deleteAll(List<Integer> ids);

 <!--批量删除用户-->
 <delete id="deleteAll" parameterType="list">
        delete from user where  id in
        <foreach collection="list" item="id" open="(" close=")" separator=",">
            #{id}
       </foreach>
</delete>

至此，AJAX+批量删除的任务基本完成！