Question

我在ASP.NET MVC 4应用程序中动态生成表。该表在列中有输入框。我必须保存这些输入框中的数据。生成的表格为 enter image description here

点击上面的保存按钮，我正在从jquery中的表中读取数据

    var estimDetails = $('#editorRows tr:has(td)').map(function (i, v) {
                         var $td = $('td', this);
                         return {
                             ItemId: $($td[0]).find("select").val(),
                             Description: $($td[1]).find("input").val(),
                             Quantity: $($td[2]).find("input").val(),
                             Amount: $($td[3]).find("input").val()
                         }
                     }).get();
    //Convert data to JSON
    var estimateObject = JSON.stringify({ 'JsonString': estimDetails });
//post data to Controller Action
 $.ajax({
                 type: 'POST',
                 url: '@Url.Action("SaveEstimate")',
                 data: estimateObject,
                dataType: 'json',
                 contentType: 'application/json; charset=utf-8',
                 success: function (data) {
                     if (data)
                         alert("Saved Successfully");
                 },
                 error: function (response) {
                     debugger;
                     alert(response);
                 }
             });

检查＆＃39;估计对象＆＃39;值为
enter image description here

我的行动方法是

  [HttpPost]
        public JsonResult SaveEstimate(string JsonString)
        {
            try
            {
                DateTime expDate;
                DateTime expiryDt = new DateTime();


                return Json("true", JsonRequestBehavior.AllowGet);
            }
            catch (Exception e)
            {

                return Json("false", JsonRequestBehavior.AllowGet);
            }
        }

但是＆＃39; JsonString＆＃39;永远是空的。我尝试了不同的东西，比如将字符串保留在控制器中的ViewModel中但没有帮助。请帮助我。

Answer 1

要么尝试这样做

 [HttpPost]
        public JsonResult SaveEstimate(string id) 
        {
            try
            {
                DateTime expDate;
                DateTime expiryDt = new DateTime();


                return Json("true", JsonRequestBehavior.AllowGet);
            }
            catch (Exception e)
            {

                return Json("false", JsonRequestBehavior.AllowGet);
            }
        }

或在AJAX调用中

$.ajax({
                 type: 'POST',
                 url: '@Url.Action("SaveEstimate")',
                 data: "JsonString=" + estimateObject,
                 dataType: 'json',                    
                 success: function (data) {
                     if (data)
                         alert("Saved Successfully");
                 },
                 error: function (response) {
                     debugger;
                     alert(response);
                 }
             });

Answer 2

我建议使用此代码

 public  Class Estimate{
    public int ItemId{get;set;}
    public string Description{get;set;}
    public int Quantity{get;set;}
    public int Amount{get;set;}

    }

在控制器

中

 [HttpPost]
    public JsonResult SaveEstimate(Estimate model) 
    {
      //To Do
    }

在客户端代码中

      var estimDetails = $('#editorRows tr:has(td)').map(function (i, v) {
                         var $td = $('td', this);
                         return {
                             ItemId: $($td[0]).find("select").val(),
                             Description: $($td[1]).find("input").val(),
                             Quantity: $($td[2]).find("input").val(),
                             Amount: $($td[3]).find("input").val()
                         }
                     }).get();
    //Convert data to JSON
    var estimateObject = JSON.stringify({ 'model': estimDetails });
//post data to Controller Action
 $.ajax({
                 type: 'POST',
                 url: '@Url.Action("SaveEstimate")',
                 data: estimateObject,
                dataType: 'json',
                 contentType: 'application/json; charset=utf-8',
                 success: function (data) {
                     if (data)
                         alert("Saved Successfully");
                 },
                 error: function (response) {
                     debugger;
                     alert(response);
                 }
             });

Answer 3

当您发送$（）。ajax时，您的控制器操作将通过名称输入HTTP参数解析为C＃方法参数。要在$（）。ajax中使用数据选项

发送数据

 $.ajax({
                 type: 'POST',
                 url: '@Url.Action("SaveEstimate")',
                 data: {someData:'sss'}   //Look here
             });

当ajax发出javaScript对象时，你把它放到数据中，由成员解析为HTTp参数（Object的每个字段都把参数名称放到name，value to value）。

因此，在我的示例中，有一些数据HTTP参数值为＆＃39; sss＆＃39;。在Action MVC中，尝试查找称为C＃方法参数的HTTP参数，并自动设置他们的值。

在你的代码中MVC期望参数类型为String的JsonString，但是$（）。ajax在数据中发送一个字符串（在字符串化json之后），因此jQuery创建一个HTTP参数数据并为其添加一个字符串值。

要使代码正常工作，您必须执行以下操作：

仅对有效负载数据进行字符串化

var estimateObject = { 'JsonString': JSON.stringify(estimDetails) };

简单地发送ajax结果对象

$.ajax({
             type: 'POST',
             url: '@Url.Action("SaveEstimate")',
             data: estimateObject,
             success: function (data) {
                 if (data)
                     alert("Saved Successfully");
             },
             error: function (response) {
                 debugger;
                 alert(response);
             }
         });

因此，jQuery查找到estimateObject，在其中只找到一个字段JsonObject，创建相同的HTTP参数并发送到服务器。在参数JsonObject的HTTP参数中查找MVC，找到它并使用stringify JSON设置名称为JsonObject的C＃方法参数的值。

发送从动态表生成的JSON字符串时发布的空数据

3 个答案: