1、Html代码，将所有CheckBox包含于删除表单，并且所有列表项的CheckBox使用相同的Name，并且Value设置为数据项主键ID
@using (Html.BeginForm("Delete", null, FormMethod.Post, new { id = "DeleteForm" }))
{
@Html.AntiForgeryToken()
<div id="table-scrollable" class="table-scrollable">
<table class="table table-striped table-hover table-border-top">
<thead>
<tr>
<th class="table-checkbox">
<input id="checkall" type="checkbox" class="group-checkable" />
</th>
<th>序号</th>
<th>
其它数据
</th>
</tr>
</thead>
<tbody>
@{ ;}
@foreach (var item in Model) {
<tr>
<td>
<input name="guids" type="checkbox" class="checkboxes" value="@item.GUID" />
</td>
<td>@(Model.StartItemIndex + i++)</td>
<td>
其它数据
</td>
</tr>
}
</tbody>
</table>
</div>
}
2、JS脚本，主要用于操作表头进行全选和取消全选，此处需注意，存在分页情况时，全选操作只针对当前页的列表项，不能选择未展示的数据；
//表头CheckBox操作全选或取消全选
$("#checkall").click(function () {
var ischecked = this.checked;
$("input:checkbox[name='guids']").each(function () {
this.checked = ischecked;
});
});
同时，JS也负责表单提交前进行弹窗提醒，此处使用的是bootbox控件弹出提示窗，也可以使用其它弹窗组件
$("#delete").click(function () {
;
$("input:checkbox[name='guids']").each(function () {
if (this.checked) count++;
});
) {
bootbox.dialog({
size: "small",
onEscape: "true",
message: "你确定要批量删除勾选的 " + count + " 条记录吗?",
title: "操作确认",
buttons: {
OK: {
label: " 确定 ",
className: "red-haze fa fa-check ",
callback: function () {
$("#DeleteForm").submit();
}
},
Cancel: {
label: " 取消 ",
className: "green-jungle fa fa-times ",
callback: function () {
}
}
}
});
}
else {
bootbox.dialog({
size: "small",
onEscape: "true",
message: "请先选择你要删除的记录！",
title: "操作提示",
buttons: {
OK: {
label: " 确定 ",
className: "green-jungle fa fa-bell-o",
callback: function () {
}
}
}
});
}
});
3、Controller代码，通过List类型接收同名的表单数据项
[HttpPost]
[ValidateAntiForgeryToken]
public ActionResult Delete(List<Guid> guids)
{
)
{
db.TargetTable.Where(x => guids.Contains(x.GUID)).ToList().ForEach(x =>
{
db.TargetTable.Remove(x);
});
db.SaveChanges();
}
return Redirect(Request.UrlReferrer.ToString());
}