使用JavaScript实现单击复选框实现全选与全不选功能并通过ajax实现批量删除功能

前台页面通过sJavaScript实现单击复选框实现全选与全不选功能代码:

function checkAll() {
				var all = document.getElementById("allCheck");//获取点击全选的父复选框
				var one = document.getElementsByName("oneCheck");//获取子复选框
				if(all.checked){//遍历循环子复选框,如果父复选框选中,则子复选框也选中
					for(var i=0;i<one.length;i++){
						one[i].checked = true;
					}
				}else{
					for(var i=0;i<one.length;i++){
						one[i].checked = false;
					}
				}
			}
实现批量删除功能前台页面代码:
$(function(){
				$("#moreDel").click(function(){
					//创建存放复选框的数组
					var list = [];
					//获取复选框的值并存入数组 
					$("input[name='oneCheck']:checked").each(function(){
		                    list.push($(this).val());
		                }); 
					//判断是否有勾选复选框
					if(list.length!=0){
					$.ajax({
						type:"post",//提交方式
						url:"salary/deleteSalary",//控制层的路径
						data:"oneCheck="+list,
						success:function(){
							//当删除成功后刷新页面
							setTimeout("location.reload()",100);
						}
						});
					}else{
						alert("请勾选您所需要删除的信息!");
					};
				});
			})
后台控制层代码:

		Map<String, Object> map = new HashMap<String, Object>();
		// 获取复选框的状态
		String checkbox = request.getParameter("oneCheck");
		// 判断是否有选中复选框
		if (checkbox != null) {
			// 创建集合存放复选框对应的值
			List<Integer> list = new ArrayList<Integer>();
			// 将从页面获取到的值用“,”分开
			String[] str = checkbox.split(",");
			//遍历值并转换为int类型存入集合
			for (String string : str) {
				int salaryId = Integer.parseInt(string);
				list.add(salaryId);
			}
			//将保存值的集合存入map
			map.put("salaryIds", list);
			//调用方法批量删除
			sb.deleteSalary(map);
		}
mybatis映射文件的代码:

<foreach collection="salaryIds" item="salaryId" separator="," open="(" close=")">
				delete from salary where salaryId in #{salaryId}
			</foreach>


猜你喜欢

转载自blog.csdn.net/pyy542718473/article/details/72495937