基於jsp和servlet,通過複選框實現批量刪除的功能
複選框實現批量刪除
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<%@ taglib uri="http://java.sun.com/jstl/core_rt" prefix="c" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Insert title here</title>
<script type="text/javascript">
/**
* 操作全選複選框事件
**/
function doCheck(obj)
{
var isCheck=obj.checked;
var inputs=document.getElementsByTagName("input");
for(var i=0;i<inputs.length;i++)
{
if(inputs[i].type=="checkbox" && inputs[i].id!="chkMsgId") //刷選出所有複選框
{
inputs[i].checked=obj.checked;
if(isCheck==true){
inputs[i].name="check";
}else{
inputs[i].name="user";
}
}
}
}
/**
* 複選框變化 全選按鈕變化
**/
function toChkSon(obj)
{
var isCheck=obj.checked;
obj.name="check";
//alert(obj.name);
if(isCheck==false) //當此複選框未選中 全選為未選
{
document.getElementById("chkMsgId").checked=false;
obj.name="user";
//alert(obj.name);
return ;
}
var chkInputs=getCheckBox(); //獲取所有複選框
var j=0;
for(var i=0;i<chkInputs.length;i++)
{
if(chkInputs[i].checked==isCheck)
j++;
else
break;
}
if(j==chkInputs.length) //當所有複選框為同一狀態時 賦值全選同一狀態
document.getElementById("chkMsgId").checked=isCheck;
}
/**
* 獲取所有複選框
**/
function getCheckBox()
{
var inputs=document.getElementsByTagName("input");
var chkInputs=new Array();
var j=0;
for(var i=0;i<inputs.length;i++)
{
if(inputs[i].type=="checkbox" && inputs[i].id!="chkMsgId") //刷選出所有複選框
{
chkInputs[j]=inputs[i];
j++;
}
}
return chkInputs;
}
/**
*提交表單
*/
function submitForm(){
document.getElementById("myForm").submit();
}
</script>
</head>
<body>
<form name="myForm" id="myForm" action="UserDeleteServlet" method="post">
<table align="center" border="1">
<tr>
<td><input type="checkbox" name="chkMsgId" id="chkMsgId" onclick="doCheck(this)" /></td>
<td>姓名</td>
<td>城市</td>
<td>通訊錄</td>
<td>修改</td>
</tr>
<c:forEach var="item" items="${requestScope.userlist}">
<tr>
<td><input type="checkbox" onclick="toChkSon(this);" value="${item.id }" id="user" name="user" /></td>
<td>${item.username }</td>
<td>${item.cityname }</td>
<td><a href="GetTelsServlet?uid=${item.id }" target="frame2">通訊錄</a></td>
<td><a href="UserUpdateServlet?uid=${item.id }" target="frame1">修改</a></td>
</tr>
</c:forEach>
<tr>
<td><a href="useradd.jsp" target="frame1">增加</a></td>
<!-- <td><a onclick="submitForm()" href="" target="frame1">刪除</a></td> -->
<td><input type="button" value="刪除" onclick="submitForm()" /></td>
</tr>
</table>
</form>
</body>
</html>
後臺的servlet
public class UserDeleteServlet extends HttpServlet {
protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
this.doPost(request, response);
}
/**
* @see HttpServlet#doPost(HttpServletRequest request, HttpServletResponse response)
*/
protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
//處理亂碼
response.setContentType("text/html;charset=UTF-8");
request.setCharacterEncoding("UTF-8");
PrintWriter out = response.getWriter();
String users[]=request.getParameterValues("check");//用陣列接受前臺傳來的被選中的複選框的值
if(users!=null){
UserDao userDao=new UserDao();
TelDao telDao=new TelDao();
int m=0;
int n=0;
for(int i=0;i<users.length;i++){//迴圈刪除被選中的資料
int id=Integer.parseInt(users[i]);
m=userDao.delete(id);
//刪除一個使用者,同時要刪除他所屬的通訊錄(根據使用者userid=id來刪除)
//System.out.println(id);
//n=telDao.deleteTelByUser(id);
}
if(m>0){//成功
out.println("<script>alert('刪除成功!');window.location.href='GetUserSevrlet'</script>");
out.close();
}else{//失敗
out.println("<script>alert('刪除失敗,請重試!');window.location.href='GetUserSevrlet'</script>");
out.close();
}
}
}
}