数据的新增&保存

 

开发工具与关键技术：VS、

作者：#33

撰写时间：撰写时间：2019年04月23日

 

老师MVC教学中学习关于数据新增的知识， 1、新增和修改各有模态窗体（条件一）；2、新增和修改公用一个模态窗体（条件二）。新增：点击新增按钮，模态窗体打；点击保存按钮提交数据，至控制器保存输入的数据，返回提示信息。

一、新增和修改各有模态窗体：

给新增按钮绑定一个onclick的方法打开窗体；

在form表单中加入隐藏域input  type为reset的标签的用于表单重置（红色剪头）

function InsertEmployee() { //新增按钮 $("#formInsertEmployee input[type='reset']").click();//获取from表单的ID-重置表单 $("#modInsertEmployee").modal();//获取模态窗体的ID-打开新增员工模态窗体}

保存新增信息，获取填写的信息，判断信息是否填写完整，提交数据至控制器新增。 function saveInsertemployee() {//保存新增的按钮 //获取各值     var employeeID = $("#employeeID").val();//获取员工ID（隐藏域），（上图蓝色箭头）     var Num = $("#employeeNum").val();     var Name = $("#employeeName").val();     var phone = $("#telphone").val(); var addres = $("#address").val(); //判断是否为空 if (employeeID!=""&&Num != "" && Name != "" && phone != "" && addres != "") {         $.get("InsertEmployeeInfor", {//数据接口（数据提交路径） employeeID:employeeID, employeeNum: Num, employeeName: Name, telphone: phone, address: addres            }, function (data) {              if (data.State == true) {                 layer.alert(data.Text);                 $("#modInsertEmployee").modal('hide'); //关闭模态窗体                 Tabemployee.reload();//表格刷新              } else {                 layer.alert(data.Text); }}); } else { layer.alert("请将数据填写完整！");} }

控制器新增方法： public ActionResult InsertEmployeeInfor(PW_Employee modEmployee) {   ReturnJson msg = new ReturnJson();//实例化 try{      if (!string.IsNullOrEmpty(modEmployee.employeeName)) {         int oldCount = (from tbEmployee in myModel.PW_Employee                where tbEmployee.employeeName == modEmployee.employeeName.Trim()                select tbEmployee).Count();         if (oldCount == 0) {            myModel.PW_Employee.Add(modEmployee); //Add（）方法添加新增数据            if (myModel.SaveChanges() > 0) { //判断是否添加成功              msg.State = true; msg.Text = "保存成功！";}            else{msg.Text = "保存失败！";} }         else{ msg.Text = "已经存在！";}} else{ msg.Text = "数据不完整！";}} catch (Exception) {msg.Text = "数据异常！";}    return Json(msg, JsonRequestBehavior.AllowGet); }

二、新增修改公用一个模态窗体时：声明一个bool类型的全局变量（var BLInsertUpdate = true;），true为新增，false为修改

保存方法,if语句判断当BLInsertUpdate = true时为新增保存；为 false时修改保存

三、应用layui的弹出层：声明模块全局变量（var layerIndex;），（layer.open）打开模态窗体。

//定义一个方法关闭弹出层 function layerClose() { layer.close(layerIndex); }

function InsertEmployee() {新增方法     BLInsertUpdate = true;     $('#formEmployee input[type="reset"]').click();//重置表单  layerIndex = layer.open({//弹出layer窗体 //弹出层共有5种：0（信息框，默认）1（页面层）2（iframe层）3（加载层）4（tips层）     type: 1, //新增用到页面层 area: ["480px", "180px"],//弹出层的大小     offset: "150px",//弹出层的偏移量（位置） title: "新增",//弹出层的标题     content: $("#modEmployee")//弹出层的模态窗体}); }

function saveemployee() {保存新增、修改方法    if ($('#formEmployee [name="employeeName"]').val() != "") {//判断数据是否为空         var url = "";         if (BLInsertUpdate) {url = "InsertEmployeeInfor";}//新增保存路径         else {url = "UpdateEmployeeInfor";}//修改保存路径         //序列化表单:新增：名称，修改：ID，名称)         var formDate = $("#formEmployee").serializeArray();         $.post(url, formDate, function (msg) {           if (msg.State) { layerClose();//关闭窗体           Tabemployee = layuiTable.reload('tabemployee'); //操作完成后刷新table}           layer.alert(msg.Text); });}     else { layer.alert('请填写完整', { icon: 0 });}}