Asp.Net MVC4通过ID更新表单

用户需求是：一个表单一旦创建完，其中大部分的字段便不可再编辑。只能编辑其中部分字段

而不可编辑是通过对input输入框设置disable属性实现的，那么这时候直接向数据库中submit表单中的内容就会报错，因为有些不能为null的字段由于diabled属性根本无法在前端被获取而后更新至数据库

有下面两种思路：

1、通过创建隐藏表单，为每一个disabled控件分别创建一个隐藏控件，但是这样的问题是工作量太大

2、通过获取该表单在数据库中的ID，把该id和可以编辑的字段传递到后台。首先通过ID将对象及其属性数据从数据库中搜索出来，然后将可以编辑的字段赋值给该对象。处理完毕后，再将该对象的数据更新至数据库

综上所述，用第二种思路就能显得更加睿智

下面是具体的操作步骤：

1、在OutsourcingModule.cs中创建路由，以此创建一个访问路径：

routes.MapRoute(
"OutSourcingWorkSheet",//路由名
"outsourcing/saveWorkSheet",//url路径
new {controller="Outsourcing",action="SaveWorkSheet"}//映射的控制器以及对应的Action方法名
);

2、

///<summary>

///保存工作票

///ModelBinder会将前端传递过来的饿ID在数据库中搜索出字段并且转换为outsourcing对象

///此时的oursourcing对象中的workSheets属性不是前端传递过来的值，而是数据库中的

///

///方法中有两个参数，outsourcing上面已经解释，workSheets是前端传递过来的第二个参数

///<summary>

///<param name="outsourcing"></param>

///<param name="workSheets"></param>

///<returns></returns>

[HttpPost]

[ActionName("SaveWorkSheet")]

[AccessRestriction("SaveWorkSheet")]

public JsonResult SaveWorkSheet(Outsourcing outsourcing ,string workSheets)

{

if(outsourcing !=null)

{

    outsourcing.WorkSheets=workSheets;

     _outsourcingService.Save(outsourcing);

     return Json(new ABResponse(HttpStatusCode.OK));

}

 return Json(new ABResponse(HttpStatusCode.BadRequest));

}//AB为内部项目

3、前端js脚本代码

$('#btn_saveWorkSheet').on('click',function(){
   if($("input[name=workSheets]").val()==""){
        bootbox.alert("不能为空");
    }
           else{
                     $.ajax({
                                  type:"post",
                                  url:"/outsourcing/saveWorkSheet",
                                  data:{
                                            ID:$("#outsourcing_id").val(),
                                            WorkSheets:$("input[name=workSheets]").val()
},
                                   dataType:"json",
                                   success:function(data){
                                          if(data.Code==200){
                                                bootbox.alert("修改成功，即将刷新");
                                                setTimeout(function(){
                                                           location.reload();
                                                  },1000);
                                                 }
                                                     else{
                                                             bootbox.alert("提交失败，请稍后再试");
}
}
});
}
});
     

其实思路很简单，但是我做了大半天，还遇到了一个大坑：

在第二段代码的参数列表中，我一开始把string workSheets写成了WorkSheets。这时文字下出现了蓝色的波浪线，Alt+Enter后系统提示Rename to workSheets，我便直接回车确定了。然后，

WorkSheets字段便再也无法保存，也不能从数据库中读取。在同事帮忙找了N久之后发现，原来是当时大写改小写的过程中同时将dbml文件中的字段也改成了小写导致了无法和数据库匹配

做这个功能的时候顺便学到的一点知识：

如果一个input的ID为Apple，那么可以这么获取，这是我本来就知道的：

var apple=$("#apple").val();

如果一个input的name为apple，那么可以这么获取，这是我刚知道的：

var apple=$("input[name=apple]").val();

还有一个刚知道的，如果从很多input中去除某个name：

$("#fruit").find("input:not(input[name=apple]),textarea,select").attr("disabled",true);

//从ID为fruit的父元素里面寻找所有的input、textarea和select控件以及其值，但是除去name为apple的控件

另外总结下ajax的方式：

$.ajax({
           type:"post",//可以选择post或者method
           url:"",//URL接口
           data:{
                   //参数列表
           },
             success:function(data){
                   //如果访问URL成功，data就是该URL接口自动返回的数据
}
})