页面的修改_修改页面-优快云博客

本文介绍数据修改的实现方法。先按之前教程渲染表格，设置自定义列及修改按钮点击事件，在 HTML 写入修改模态窗体并编写代码，点击按钮弹出窗体。在控制器写方法获取原数据，修改完成后在视图页面设置保存按钮，再到控制器写相应方法，同时要判断数据不为空。

今天，我们来说说如何修改数据吧，，上次我们写了新增，，首先，我们按照上篇的教程渲染出表格，然后我们自己设置了一个自定义列，并在自定义列中的修改按钮中设置点击事件，首先要在html写入修改的模态窗体，然后再写下如下代码

function openUpdate(ID) {
            $.post("/Main/SelectAcamedeByID", { employeeID: ID }, function (data) {
                //console.log(data[0].AcademeCode);
                $("#UemployeeNum").val(data[0].employeeNum);
                $("#UemployeeName").val(data[0].employeeName);
                $("#Utelphone").val(data[0].telphone);
                $("#Uaddress").val(data[0].address);
                $("#employeeID").val(data[0].employeeID);
                $("#modalUpdateEmployee").modal();
            });
        }

写好后，点击修改按钮就会弹出修改的模态窗体，然后再在控制器中写一个方法

public ActionResult SelectAcamedeByID(int employeeID)
        {
            var list = from tbAcademe in myModel.PW_Employee
                       where tbAcademe.employeeID == employeeID
                       select new //匿名形式
                       {
                           tbAcademe.employeeID,
                           tbAcademe.employeeNum,
                           tbAcademe.employeeName,
                           tbAcademe.telphone,
                           tbAcademe.address
                       };
            return Json(list, JsonRequestBehavior.AllowGet);
        }

因为是修改，所以我们要获取原来数据，一共有四个值，所以要设置四个来获取。这样，点击修改按钮就会弹出原数据，再进行修改
在这里插入图片描述
修改完成后，接下来要进行保存。因为是两个模态窗体，保存按钮我需要出现在视图页面设置，写下如下代码。

function savaUpdate() {
            var Num = $("#UemployeeNum").val();
            var Name = $("#UemployeeName").val();
            var telphone = $("#Utelphone").val();
            var address = $("#Uaddress").val();
            var id = $("#employeeID").val();
            $.get("/Main/Update",
                { employeeID: id, employeeNum: Num, employeeName: Name, telphone: telphone, address: address }
                , function (msg) {
                    if (msg.State == true) {
                        layer.alert(msg.Text);
                        $("#modalUpdateEmployee").modal('hide');
                        employee.reload();
                    } else {
                        layer.alert(msg.Text);
                    }
                });
        }

然后我们在去控制器下相应的方法

public ActionResult Update(int employeeID, string employeeNum, string employeeName, string telphone, string address)
        {
            ReturnJson msg = new ReturnJson();
            if (employeeID != 0 && !string.IsNullOrEmpty(employeeNum)
                && !string.IsNullOrEmpty(employeeName) && !string.IsNullOrEmpty(telphone) && !string.IsNullOrEmpty(address))
            {
                PW_Employee modAcademe = new PW_Employee();
                modAcademe.employeeID = employeeID;
                modAcademe.employeeNum = employeeNum;
                modAcademe.employeeName = employeeName;
                modAcademe.telphone = telphone;
                modAcademe.address = address;
                myModel.Entry(modAcademe).State
                    = System.Data.Entity.EntityState.Modified;
                if (myModel.SaveChanges() > 0)
                {
                    msg.State = true;
                    msg.Text = "修改成功！";
                }
                else
                {
                    msg.State = false;
                    msg.Text = "修改失败！";
                }

            }
            else
            {
                msg.State = false;
                msg.Text = "学院名称或则学院编号不能为空！";
            }
            return Json(msg, JsonRequestBehavior.AllowGet);
        }

要注意的是数据不能改为空，所以我们要多加个判断，这样一个修改就完成了