一、想要实现这样的操作
1、分布视图页面_NewList（这里用的是异步加载数据）：
@using Webdiyer.WebControls.Mvc;
@model PagedList<Domain.Entities.Finance>
<div class="list">
<div class="datelist clearfix">
<table class="table" cellpadding="0" cellspacing="0">
<tr>
<th width="30" style="border-radius: 10px 0px 0px;"><input id="SelectAll" type="checkbox" /></th>
<th width="275">项目名称</th>
<th width="75">类型</th>
<th width="50">金额</th>
<th width="50">报销单</th>
<th width="30">是否报销</th>
<th width="50">添加人</th>
<th width="140">添加时间</th>
<th width="170" style="border-radius: 0px 10px 0px 0px;">操作</th>
</tr>
@if (Model != null)
{
foreach (var item in Model)
{<tr ><td><input value="@item.Id" data-adminId="@item.Admin_Id" data-p="@item.State" type="checkbox"/></td>
<td>@item.Name</td>
<td>@(item.Type==2:"收入":"支出")</td>
<td>@item.Money</td>
<td>@(item.PayUrl!=null:"有"："无")</td>
<td>@(item.IsPay==1:"是"："否")</td>
@if (ViewBag.AdminList!= null){
if (item.AdminId!= null)
{
foreach (Domain.Entities.Admin admin in ViewBag.AdminList)
{
if (item.AdminId == admin.Id)
{<td>@admin.Name</td>}
}
}
else{ <td></td>}}else{ <td></td>}
<td>@item.Add_Date</td>
<td><a data-id="@item.Id" style="cursor: pointer;" ruleId="Finance/Update" id="Update">修改</a>
<a data-id="@item.Id" style="cursor: pointer;" ruleId="Finance/ThoughtPay" id="ThoughtPay">报销</a>
<a data-id="@item.Id" style="cursor:pointer;" ruleId="Finance/Del" id="Del">删除</a>
</td>
</tr> }}
</table>
</div>
</div>
<div class="tital_bar">
<div class="operateAndPagin clearfix">
<p class="o_lt">
<a id="BatchDeleteItem" ruleid="Finance/BatchDeleteItem" class="btn btn32_cnt">批量删除</a>
<a id="BatchPay"ruleid="Finance/BatchPay" class="btn btn32_cnt">批量报销</a>
<a id="CancelBatchPay" ruleid="Finance/CancelBatchPay" class="btn btn32_cnt">批量取消报销</a>
</p>
<div class="Pagination">
@Ajax.Pager(Model, new PagerOptions
{
PageIndexParameterName = "pageIndex",
ShowPageIndexBox = true,
PageIndexBoxType = PageIndexBoxType.DropDownList,
NumericPagerItemCount = 3,
CurrentPagerItemWrapperFormatString = "<span class=‘current‘><a data-pageindex={0} href=‘/Finance/FinanceList?pageIndex={0}‘>{0}</a></span>",
ShowGoButton = false
},
new MvcAjaxOptions
{
UpdateTargetId = "datas",
HttpMethod = "Post",
DataFormId = "searchForm",
}, new { id = "diggpager" })
<div class="clear"></div>
</div>
</div>
</div>
2、在视图中FinanceList:
<script src="@Url.Content("~/Scripts/js/jquery-1.8.2.min.js")" type="text/javascript"></script>
<script src="../../Scripts/js/Finance.js" type="text/javascript"></script>
<script type="text/javascript">
$(function () {
window.Finance.Init();
});
</script>
3、在Finance.js中：
(function () {
var Finance= {
Init: function () {
$("#SelectAll").live("click", this.SelectAll);
$("#BatchDeleteItem").live("click", this.BatchDeleteItem); //批量删除
$("#BatchPay").live("click", this.BatchPay); //批量报销
$("#CancelBatchPay").live("click", this.CancelBatchPay); //批量取消报销
$("#Del").live("click", this.Del); //删除
$("#Update").live("click", this.Update); //修改
$("#ThoughtPay").live("click", this.ThoughtPay); //报销
$(document).ajaxSuccess(function (event, xhr, settings) {
$(".datelist").find("table tr:even").addClass("bgcolor");
});
},
SelectAll: function () {
if ($(this).is(":checked")) {
$(".datelist :checkbox").attr("checked", true);
} else {
$(".datelist :checkbox").removeAttr("checked");
}
},
Del: function () {
var id = $(this).attr("data-id");
if (!confirm("确定要删除该信息吗？")) { return false; }
$.ajax({
type: "POST",
url: "/Finance/Del",
data: { "Id": id },
dataType: "json",
success: function (data) {
if (data.Is_Success) {
location.href = "/Finance/FinanceList";
}else {alert(data.Message);}
}
});
},
Update: function () {
var id = $(this).attr("data-id");
if (!confirm("确定要修改信息吗？")) { return false; }
$.ajax({
type: "POST",
url: "/Finance/Update",
data: { "Id": id },
dataType: "json",
success: function (data) {
if (data.Is_Success) {
location.href = "/Finance/FinanceList.html";
}else { alert(data.Message);}
}
});
},
ThoughtPay: function () {
var id = $(this).attr("data-id");
if (!confirm("确定要报销信息吗？")) { return false; }
$.ajax({
type: "POST",
url: "/Finance/ThoughtPay",
data: { "Id": id },
dataType: "json",
success: function (data) {
if (data.Is_Success) {
location.href = "/Finance/FinanceList";
}else { alert(data.Message); }
}
});
},
BatchDeleteItem: function () {
var re = true;
var ids = GetCheckedId();
if (!ids) { alert("请选择要删除的信息!"); return false; }
if (!confirm("确定要删除选中项吗？")) { return false; }
var adminId = $("#adminId").val();
var adminIds = "";
$(".datelist :checked").each(function () {
var admin = $(this).attr(‘data-adminId‘);
var state = $(this).attr(‘data-p‘);
if (admin != adminId || state == 1) {
re = false;
}
});
if (!re) {
alert("不能批量删除非当前用户或者已报销信息，批量删除失败！");
return false;
}
$.ajax({
type: "POST",
url: "/Finance/BatchDeleteItem.html",
data: { "Ids": ids },
success: function (data) {
if (data.Is_Success) {
location.href = "/Finance/FinanceList.html";
}
else { alert(data.Message); }
}
});
},
BatchPay: function () {
var states = GetCheckedData("data-s");
var ids = GetCheckedId();
if (!confirm("确定要报销选中的信息吗？")) { return false; }
$.ajax({
type: "POST",
url: "/Finance/BatchPay",
data: { "ids": ids },
dataType: "json",
success: function (data) {
if (data.Is_Success) {
location.href = "/Finance/FinanceList.html";
}else { alert(data.Message); }
}
});
},
CancelBatchPay: function () {
var states = GetCheckedData("data-s");
var ids = GetCheckedId();
if (!confirm("确定要取消报销选中的信息吗？")) { return false; }
$.ajax({
type: "POST",
url: "/Finance/CancelBatchPay.html",
data: { "ids": ids },
dataType: "json",
success: function (data) {
if (data.Is_Success) {
location.href = "/Finance/FinanceList.html";
}else { alert(data.Message); }
}
});
}
window.Finance= Finance;
function GetCheckedId() {
var ids = $(".datelist :checked").map(function () {
if ($(this).attr("id") == "SelectAll") {
return "";
}
return $(this).val();
}).get().join(",");
return ids;
};
function GetCheckedData(data) {
var ids = $(".datelist :checked").map(function () {
if ($(this).attr("id") == "SelectAll") {
return "";
}
return $(this).attr(data);
}).get().join(",");
return ids;
};
})();
4、Controller中（以批量删除为例子）
[AuthorizationFilter]
public ActionResult BatchDeleteItem(string Ids)
{
Finance newsModel = new Finance();
if (Ids.IndexOf(‘,‘) == 0)
{
Ids = Ids.Remove(0, 1);
}
int result = FinanceClient.FinancesListState(AdminId,Ids,0);
if (result > 0)
{
return Json(new { Is_Success = true, Message = "批量删除信息成功！" });
}
else if(result==-2)
{
return Json(new { Is_Success = false, Message = "批量删除的信息中有已报销信息，批量删除失败！" });
}
else if (result == -3)
{
return Json(new { Is_Success = false, Message = "不能批量删除非当前用户的财务信息，批量删除失败！" });
}
return Json(new { Is_Success = false, Message = "批量删除信息失败！"});
}
其中对于后台错误信息可以返回Content，例如：
return Content("<script> alert(‘获得数据失败！‘);window.location=‘/Home/FinanceList.html‘</script>");
return Content("<script> alert(‘获得数据失败！‘);history.back()</script>");