表单复选框选择删除

 

在JavaWeb项目中，常常有一些表格的分页显示，而我们有需要使用复选框选择删除的功能。

首先表格的显示。

<span style="font-size:14px;"><table cellspacing="0" cellpadding="0" class="TableStyle">
       
        <!-- 表头-->
        <thead>
            <tr align=center valign=middle id=TableTitle>
                <td width="30px"> </td>
                <td width="70px">操作</td>
				<td width="100px">添加时间</td>
            	<td width="80px">状态</td>
                <td width="80px">来文单位</td>
                <td width="150px">来文标题</td>
				<td width="150px">来文文号</td>
				<td width="150px">标题</td>
                <td width="100px">收文文号</td>
            </tr>
        </thead>

		<!--显示数据列表-->
        <tbody id="TableData" class="dataContainer" datakey="processDefList">
        	<c:forEach items="${list}" var="d">
				<tr align=center class="TableDetail1 template">
	                <td><input type="checkbox" value="${d.id}"></td>
	                <td>
	                	<c:if test="${not empty d.docTempExp.id}">
	                    	<a href="showDocTempExp/${d.docTempExp.id}">查看表单</a>
	                    </c:if>
	                </td>
					<td>${d.createDate}</td>
					<td>${d.docStateString}</td>
	                <td>${d.princOrgan}</td>
	                <td>${d.princTitle}</td>
					<td>${d.releaseNo}</td>
	                <td>${d.title}</td>
	                <td>${d.docNo}</td>
				</tr>
			</c:forEach>
        </tbody>
</table></span>

然后是js代码的编写

<span style="font-size:14px;"><script type="text/javascript" src="js/jquery.min.js" ></script>
	<script type="text/javascript">
		function del(){
			if(confirm("确定要删除吗？")){
				var cs=$('input[type="checkbox"]:checked');
				for(var i=0, len=cs.length; i<len; i++ ){
					alert($(cs[i]).val());
					$.getJSON("removeReceive",{"id":$(cs[i]).val()},function(data){
						data.result? window.alert("删除成功!") : window.alert("删除失败!");
					});
				}	
				cs.parent().parent().remove();
			}
		}
	</script></span>