用ajax实现分页 删除功能（三）

1.下面实现全选和反选功能

		//实现全选 与反选的功能 
		$("chk").onclick = function() {
			var inputs = document.getElementsByName("delchk");

			//判断是否是选中的状态
			if ($("chk").checked) {
				//让所有input type=“checkbox”	并且 name=delchk的 变成选中状态
				for ( var i = 0; i < inputs.length; i++) {
					inputs[i].checked = "checked";
				}

			} else {
				for ( var i = 0; i < inputs.length; i++) {
					inputs[i].checked = null;
				}
			}

		}

2.下面实现批量删除功能。

首先写两个函数来封装GET 和POST的请求，需要哪个在调用哪个就成。

//ajax get请求的封装
	function get(url, params, fn) {
		//第一步：创建XMLHttpRequest对象
		var xmlHttp = createXMLHttp();
		//第二步：相应的操作
		xmlHttp.onreadystatechange = function() {
			if (xmlHttp.readyState == 4) {
				if (xmlHttp.status == 200) {
					fn(xmlHttp);
				}
			}
		}
		//第三步：打开请求  规定请求类型
		xmlHttp.open("GET", url + "?" + params, true);
		//第四步：发送请求
		xmlHttp.send(null);
	}
	//ajax post请求的封装
	function post(url, params, fn) {
		//第一步：创建XMLHttpRequest对象
		var xmlHttp = createXMLHttp();
		//第二步：相应的操作
		xmlHttp.onreadystatechange = function() {
			if (xmlHttp.readyState == 4) {
				if (xmlHttp.status == 200) {
					fn(xmlHttp);
				}
			}
		}
		//第三步：打开请求  规定请求类型
		xmlHttp.open("POST", url, true);
		//设置头信息
		xmlHttp.setRequestHeader("Content-Type",
				"application/x-www-form-urlencoded");
		//第四步：发送请求
		xmlHttp.send(params);
	}

在写一个DeleteEmployeeServlet 。在它的doGet()方法中的代码如下:

String ids = request.getParameter("ids");
		System.out.println("-------------"+ids);
		String id[] = ids.split(",");
		EmployeeService eService = new EmployeeServiceImpl();
		eService.delete(id);
		response.setContentType("text/html;charset=UTF-8");
		PrintWriter out = response.getWriter();
		out.print("ok");
		out.flush();
		out.close();

在index.jsp中写实现批量删除的功能

//删除操作

		$("delEmps").onclick = function() {
			var inputs = document.getElementsByName("delchk");
			var ids="";
			
			for ( var i = 0; i < inputs.length; i++) {
				if (inputs[i].checked) {
					ids += inputs[i].value + ",";
				}
			}
			
			if(ids.length>0){	
				//ajax请求
				get("./DeleteEmployeeServlet", "ids=" + ids + "&timeStamp="
						+ new Date().getTime(), function(xmlHttp) {
					  var msg = xmlHttp.responseText;
					  if("ok".equals(msg)){
						  showEmps(1);
					  }
				});
			}else{
				alert("请你选要删除的记录");
			}

		}

到此用ajax实现分页，删除的功能就全部实现了。