Mvc3.0 按钮放在外部的增删改查
相信网上太多太多的Mvc3.0增删改查教程，但是千篇一律，新增放列表上，编辑和删除放到列表中的行来操作。但是项目中肯定不是一成不变的，小弟我不幸赶上，我自己想把编辑和删除按钮放到列表页外进行操作，查了半天百度，无奈结果不尽如人意。所以今天发个小文章，把我实现的编辑和删除写下来，虽然很简单，但是留为记录，作为参考。
首先定义列表页，我的编辑和删除是放到列表页上的，如下代码：
<p> @Html.ActionLink("新增用户", "UserCreate", "System", null, new { target = "_blank" }) @Html.ActionLink("修改用户", "UserModify", "System", null, new { id="Modify", target = "_blank", onclick = "return GetRadioValue(this.href)" }) @Html.ActionLink("删除用户", "UserDelete", "System", null, new { onclick = "return DeleteConfirm(this)" }) @Html.ActionLink("查看用户", "Details") </p> <table class="table_list" border="0"> <colgroup> <col width="50" /> <col width="50" /> <col width="200" /> <col width="200" /> <col width="200" /> <col width="200" /> <col width="200" /> <col width="200" /> </colgroup> <thead> <tr> <td> 选择 </td> <td> 序号 </td> <td> 登录名 </td> <td> 姓名 </td> <td> 部门 </td> <td> 职位 </td> <td> 分机 </td> <td> 邮箱 </td> </tr> </thead> <tbody> @foreach (var item in ViewBag.DataTable.Rows) { <tr> <td align="center"> <input type="radio" name="rdoSelect" value='@item["EmployeeID"]'/> </td> <td align="center"> @item["Number"] </td> <td> @item["LoginName"] </td> <td> @item["EmployeeName"] </td> <td> @item["Department"] </td> <td> @item["Position"] </td> <td> @item["Extension"] </td> <td> @item["Email"] </td> </tr> } </tbody> </table>
JS代码：
<script type="text/javascript"> //修改方法 function GetRadioValue(actionLink) { var radio = $("input[name='rdoSelect']:checked"); if (radio.length == 0) { alert("请选择一条数据进行修改！"); return false; } else { //找到的位置是U的位置，所以要加10 var url = actionLink.substring(0, actionLink.indexOf("UserModify") + 10); var actionUrl = url + "/" + radio.val(); $("#Modify").attr("href", actionUrl); } } //删除方法 function DeleteConfirm(actionLink) { var radio = $("input[name='rdoSelect']:checked"); if (radio.length == 0) { alert("请选择一条数据进行删除！"); return false; } else { if (confirm("确认删除吗？")) { var actionUrl = actionLink.href + "/" + radio.val(); actionLink.href = actionUrl; } else { return false; } } } </script>
刚开始把编辑和删除放到列表上面不知道怎么调用action，而ActionLink可以定义html的属性，比如我的代码：
@Html.ActionLink("修改用户", "UserModify", "System", null, new { id="Modify", target = "_blank", onclick = "return GetRadioValue(this.href)" })
通过定义它的onclick属性来调用js获取选中的radio，然后再把ActionLink的href加上我要修改的行的ID：
//找到的位置是U的位置，所以要加10
var url = actionLink.substring(0, actionLink.indexOf("UserModify") + 10);
var actionUrl = url + "/" + radio.val();
$("#Modify").attr("href", actionUrl);
这样就可以就可以跳刀UserModify页面进行修改了。就这么简单，但是对于一个没用过Mvc的屌丝程序猿来说，实在不知道怎么实现。
另外删除和编辑稍微有点不一样的就是删除的action要定义成[HttpGet]的，不用像教程里面的还的跳转到删除页面。
#region 删除按钮事件 /// <summary> /// 删除按钮事件 /// </summary> /// <param name="id"></param> /// <returns></returns> [HttpGet] public ActionResult UserDelete(String id) { EmployeeBLL empBLL = new EmployeeBLL(); if (empBLL.DeleteEmployee(id) > 0) return RedirectToAction("UserManager"); return View(); } #endregion
最后贴上我的列表、编辑、删除的action，请大家指正。
#region 员工管理页面 /// <summary> /// 员工管理页面 /// </summary> /// <returns></returns> public ActionResult UserManager() { EmployeeBLL empBLL = new EmployeeBLL(); DataTable dt = empBLL.GetAllEmployee(); DataColumn dc = new DataColumn("Number"); dt.Columns.Add(dc); for (int i = 0; i < dt.Rows.Count; i++) { dt.Rows[i]["Number"] = i + 1; } ViewBag.DataTable = dt; return View(); } #endregion #region 修改页面 /// <summary> /// 修改页面 /// </summary> /// <param name="id"></param> /// <returns></returns> public ActionResult UserModify(string id) { EmployeeModel empModel = new EmployeeModel(); EmployeeBLL empBLL = new EmployeeBLL(); DataTable dt = empBLL.GetEmployeeByID(id); if (dt != null && dt.Rows.Count > 0) { //将DataTable转化成EmployeeModel empModel = DataTableToEmployeeModel(empModel, dt); } return View(empModel); } /// <summary> /// 将DataTable转化成EmployeeModel /// </summary> /// <param name="empModel"></param> /// <param name="dt"></param> private EmployeeModel DataTableToEmployeeModel(EmployeeModel empModel, DataTable dt) { empModel.EmployeeID = dt.Rows[0]["EmployeeID"].ToString(); empModel.EmployeeName = dt.Rows[0]["EmployeeName"].ToString(); empModel.LoginName = dt.Rows[0]["LoginName"].ToString(); empModel.Password = dt.Rows[0]["Password"].ToString(); empModel.Sex = Convert.ToInt32(dt.Rows[0]["Sex"]); empModel.IDNumber = dt.Rows[0]["IDNumber"].ToString(); empModel.AnswerCustomerCall = Convert.ToInt32(dt.Rows[0]["AnswerCustomerCall"].ToString()); empModel.Education = dt.Rows[0]["Education"].ToString(); empModel.Major = dt.Rows[0]["Major"].ToString(); empModel.CellPhone = dt.Rows[0]["CellPhone"].ToString(); empModel.Email = dt.Rows[0]["Email"].ToString(); empModel.Department = dt.Rows[0]["Department"].ToString(); empModel.Position = dt.Rows[0]["Position"].ToString(); empModel.TelePhone = dt.Rows[0]["TelePhone"].ToString(); empModel.Extension = dt.Rows[0]["Extension"].ToString(); empModel.StaffLevel = dt.Rows[0]["StaffLevel"].ToString(); empModel.CommissionerLevel = dt.Rows[0]["CommissionerLevel"].ToString(); empModel.StaffState = dt.Rows[0]["StaffState"].ToString(); empModel.EntryDate = Convert.ToDateTime(dt.Rows[0]["EntryDate"].ToString()); empModel.ConfirmationDate = Convert.ToDateTime(dt.Rows[0]["ConfirmationDate"].ToString()); empModel.DepartureDate = Convert.ToDateTime(dt.Rows[0]["DepartureDate"].ToString()); empModel.AllowLogin = Convert.ToInt32(dt.Rows[0]["AllowLogin"].ToString()); return empModel; } /// <summary> /// 修改页面按钮事件 /// </summary> /// <param name="emp"></param> /// <returns></returns> [HttpPost] public ActionResult UserModify(EmployeeModel emp) { if (ModelState.IsValid) { EmployeeBLL empBLL = new EmployeeBLL(); if (empBLL.ModifyEmployee(emp) > 0) return RedirectToAction("UserManager"); } return View(emp); } #endregion #region 删除按钮事件 /// <summary> /// 删除按钮事件 /// </summary> /// <param name="id"></param> /// <returns></returns> [HttpGet] public ActionResult UserDelete(String id) { EmployeeBLL empBLL = new EmployeeBLL(); if (empBLL.DeleteEmployee(id) > 0) return RedirectToAction("UserManager"); return View(); } #endregion
浙公网安备 33010602011771号