以下代码是js写的，请问我这么加个 “layer.confirm('确认要删除吗？'......."类似的东西让删除是提示一个确定要删除吗？特别急，老板就在办公室加班呢？多谢多谢。
<script>
$(function () {
$("#cbAll").click(function () {
$("input[name='chckBox']").prop("checked", $(this).prop("checked"));
});
});
var list = [];
$(function () {
$(".delete").click(function () {
var str = "";
$(".deletecheck").each(function () {
if ($(this).prop('checked') == true) {
list.push($(this).val());
str += $(this).val() + ",";
}
});
str = str.substr(0, str.length - 1);
$.post(
"@Url.Action("ChekBox", "Plan")",
{
list: str
},
function (data) {
if (data.Success == true) {
layer.alert("删除成功", function () { location.reload() });
}
else {
layer.alert("至少选择一个！", function () { location.reload() });
}
});
})
});
</script>
删除肯定是需要表单提交，与底层数据库交互。在删除按钮所在添加点击事件函数。参考代码如下，a标签的href是跳转到后台去处理数据的路径，如果conform弹框点击的是确定，则会跳转，否则不会。
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<%@taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>
<%@taglib uri="http://java.sun.com/jsp/jstl/fmt" prefix="fmt" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<c:if test="${loginUser!=null }">
<span>${loginUser.userName }</span><span>${loginUser.sex==1?"先生":"女士" }</span> 您好 | <a href="DoLogout" onclick="return confirm('确定注销吗？')">注销</a>
<div align="center">
<form action="DoUserList" method="post">
用户帐号：<input type="text" name="name" value="${name }"/>
用户邮箱：<input type="text" name="email" value="${email }"/>
<input type="submit" value="查询"/>
</form>
</div>
</c:if>
<c:if test="${loginUser==null }">
您尚未 <a href="login.jsp">登录</a> | <a href=reg.jsp>注册</a> </c:if>
<div align="center">
<hr/>
<table border="2">
<tr>
<th>用户编号</th>
<th>用户账号</th>
<th>用户密码</th>
<th>用户昵称</th>
<th>用户年龄</th>
<th>用户性别</th>
<th>用户邮箱</th>
<th>注册时间</th>
<th>用户权限</th>
<c:if test="${loginUser!=null }"><th>操作</th></c:if>
</tr>
<c:forEach items="${list }" var="user" varStatus="i">
<tr bgcolor="${i.index mod 2 eq 0?'yellow':'' }">
<td>${user.userId }</td>
<td>${user.userName }</td>
<td>${user.password }</td>
<td>${user.nickName }</td>
<td>${user.age }</td>
<td>${user.sex==1?"男":"女" }</td>
<td>${user.email }</td>
<td><fmt:formatDate value="${user.regDate }" pattern="yyyy-MM-dd HH:mm:ss"/></td>
<td>${user.role==1?"管理员":"普通用户" }</td>
<c:if test="${loginUser!=null }">
<td>
<c:if test="${loginUser.role==0&&user.userName==loginUser.userName }">
<a href="modify.jsp">修改</a>
</c:if>
<c:if test="${loginUser.role==1 }">
<a href="modify.jsp">修改</a> | <a href="DoDelete?userId=${user.userId }" onclick="return confirm('确定要删除该用户吗？该操作不可恢复！')">删除</a>
</c:if>
</td>
</c:if>
</tr>
</c:forEach>
</table>
<c:if test="${pageNum>1 }"><a href="DoUserList?name=${name }&email=${email }&pageNum=${pageNum-1}">上一页</a></c:if>
<c:if test="${pageNum<totalPage }"><a href="DoUserList?name=${name }&email=${email }&pageNum=${pageNum+1}">下一页</a></c:if>
<hr/>
<form action="DoUserList?name=${name }&email=${email }" method="post">
<select name="pageNum">
<c:forEach begin="1" end="${totalPage }" var="i">
<option value="${i }" <c:if test="${pageNum==i }">selected</c:if>>第${i }页</option>
</c:forEach>
</select>
<input type="submit" value="GO"/>
</form>
</div>
$(function() {
$("#cbAll").click(function() {
$("input[name='chckBox']").prop("checked", $(this).prop("checked"));
});
});
var list = [];
$(function() {
$(".delete").click(function() {
var str = "";
$(".deletecheck").each(function() {
if ($(this).prop('checked') == true) {
list.push($(this).val());
str += $(this).val() + ",";
}
});
str = str.substr(0, str.length - 1);
layer.confirm("确认要删除吗？", {
btn: ['确定', '取消'],
shade: false
}, function(index) {
layer.close(index);
$.post(
"@Url.Action("ChekBox", "Plan")", {
list: str
},
function(data) {
if (data.Success == true) {
layer.alert("删除成功", function() {
location.reload()
});
} else {
layer.alert("至少选择一个！", function() {
location.reload()
});
}
});
});
})
});
示例：
不用js，使用多选框的selectedToDo属性
1、信息列表展示页面，遍历信息集合，每条记录最前面添加一个复选框checkbox ，其value 值放记录的唯一ID，用来做删除该属性的条件。
<div class="panelBar">
<ul class="toolBar">
<li><a title="确实要删除这些信息吗?" target="selectedTodo" rel="ids" postType="string" href="${ctx}/sys/deleteSimpleUser.action" class="delete" warn="请选择需要删除的信息"><span>批量删除</span></a></li>
</ul>
</div>
<table class="table" width="100%" layoutH="138">
<thead>
<tr>
<th width="3%"><input type="checkbox" group="ids" class="checkboxCtrl"></th>
<th width="100">账户名</th>
<th width="100">姓名</th>
<th width="70">操作</th>
</tr>
</thead>
<tbody>
<c:forEach items="${SESSION_PAGE.list}" var="item">
<tr target="sid_select" rel="${item.id }">
<td><input name="ids" value="${item.id }" type="checkbox"></td>
<td>${item.user.uname}</td>
<td>${item.user.userName}</td>
<td width="70">
<a title="详细信息" href="${ctx}/sys/getSimpleUser.action?uid=${item.id}" class="btnEdit" target="navTab" rel="baseAdd">详细信息</a>
<a title="确实要删除这条记录吗?" target="ajaxTodo" href="${ctx}/sys/deleteSimpleUser.action?ids=${item.id}" class="btnDel" style="margin-left: 10px">删除</a>
</td>
</tr>
</c:forEach>
</tbody>
</table>
<li><a title="确实要删除这些信息吗?" target="selectedTodo" rel="ids" postType="string" href="${ctx}/sys/deleteSimpleUser.action" class="delete" warn="请选择需要删除的信息"><span>批量删除</span></a></li>
2、后台Action
@Action(value = "deleteSimpleUser")
public String delete() {
try {
service.delete(SimpleUser.class, ids);
MessageUtil.addRelMessage(getHttpServletRequest(), "删除用户信息成功.", "mainquery");
return SUCCESS;
} catch (Exception e) {
MessageUtil.addMessage(getRequest(), "删除失败");
return ERROR;
}
}
3、service
@SuppressWarnings("rawtypes")
public void delete(Class clazz, String ids) {
dao.deleteByIds(clazz, ids);
}
4、dao
@SuppressWarnings("rawtypes")
public void deleteByIds(Class clazz, String ids) {
if (ids != null) {
String[] temp = ids.split(",");
if (temp == null || temp.length <= 0) {
throw new RuntimeException("ids error");
}
for (String str : temp) {
if (!NumberUtil.isNumeric(str)) {
throw new RuntimeException("ids error");
}
}
//删除表中ids 包含的id 对应的数据记录，即批量删除
String hql = "delete " + clazz.getSimpleName() + " where id in(" + ids + ")";
updateByHQL(hql);
}
}
这个selectedToDo属性是dwz 富客户端框架中的属性。。。
if(confirm("确定删除吗")){
alert("删除成功");
return true;
}