登录  /  注册

分享Asp.Net MVC4如何实现通过id更新表单内容的实例分析

黄舟
发布: 2017-07-18 10:36:37
原创
1103人浏览过

一个表单一旦创建完,其中大部分的字段便不可再编辑。只能编辑其中部分字段。下面通过本文给大家分享asp.net mvc4通过id更新表单内容的思路详解,需要的朋友参考下吧

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

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

有下面两种思路:

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对象
/// 此时的outsourcing对象中的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脚本代码


$(&#39;#btn_saveWorkSheet&#39;).on(&#39;click&#39;, 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接口自动返回的数据
  }
})
登录后复制

总结

以上就是分享Asp.Net MVC4如何实现通过id更新表单内容的实例分析的详细内容,更多请关注php中文网其它相关文章!

智能AI问答
PHP中文网智能助手能迅速回答你的编程问题,提供实时的代码和解决方案,帮助你解决各种难题。不仅如此,它还能提供编程资源和学习指导,帮助你快速提升编程技能。无论你是初学者还是专业人士,AI智能助手都能成为你的可靠助手,助力你在编程领域取得更大的成就。
来源:php中文网
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn
最新问题
热门教程
更多>
最新下载
更多>
网站特效
网站源码
网站素材
前端模板
关于我们 免责申明 意见反馈 讲师合作 广告合作 最新更新
php中文网:公益在线php培训,帮助PHP学习者快速成长!
关注服务号 技术交流群
PHP中文网订阅号
每天精选资源文章推送
PHP中文网APP
随时随地碎片化学习
PHP中文网抖音号
发现有趣的

Copyright 2014-2024 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号