使用 Ajax 向控制器发送发布请求时的模型与列表<Model>答案

【问题标题】：Model vs List<Model> when sending post request to controller using Ajax使用 Ajax 向控制器发送发布请求时的模型与列表<Model>
【发布时间】：2020-05-29 04:47:51
【问题描述】：

我一直在尝试使用 ajax 将列表模型发送到控制器，但它似乎根本不起作用

型号

public string MyModel {
   public string myfieldName {get;set;}
}

控制器

 public JsonResult Create(List<myModel> list)
    {

        return Json("Success");


    }

发布请求

 $("body").on("click", "#btnSave", function () {

    var list= new Array();
    list = [{ myfieldName: 'ABC' }, { myfieldName: 'DEF' }];


    //Send the JSON array to Controller using AJAX.
    $.ajax({

        type: "POST",
        url: "/Project/Create",
        data: JSON.stringify({ list }),
        contentType: "application/json; charset=utf-8",
        dataType: "json",
        success: function (r) {
            alert(r + " record(s) inserted.");
        }
    });
});

所以当我发送它时，我检查浏览器，我可以看到请求有效负载是使用 json 对象列表发送的但是，当我转到控制器时，列表根本没有绑定它，所以我检查 http.context 以检查那里的请求有效负载，它都是空的。另一方面，当我像下面这样更改控制器时

仅使用模型发送请求

public JsonResult Create(myModel data)
{

    return Json("Success");


}

并用下面的js更改

 $("body").on("click", "#btnSave", function () {

var data ={};
data.myfieldName= "test";



//Send the JSON array to Controller using AJAX.
    $.ajax({

        type: "POST",
        url: "/Project/Create",
        data: data,
        success: function (r) {
            alert(r + " record(s) inserted.");
        }
    });
});

这里唯一的区别是我不作为 json 发送，所以我的问题是发送模型与使用 ajax 的模型列表之间的区别是什么我可以改变什么来让控制器绑定数据或接受模型数据列表注意到我正在使用.Net core 2.0

谢谢

【问题讨论】：

在您的AJAX 通话中，您的data 应该是：data: JSON.stringify(list),
也试过了，还是不行
你试过我的解决方案了吗？

标签： javascript c# .net asp.net-mvc asp.net-ajax

【解决方案1】：

我通常使用这种方法将我的Model 作为List 发送到我的Controller 方法。我将尝试向您展示您的方案，您如何做到这一点：

AJAX：

 $("body").on("click", "#btnSave", function () {

    var list= new Array();
    list = [{ myfieldName: 'ABC'}, { myfieldName: 'DEF'}];


    //Send the JSON array to Controller using AJAX.
        $.ajax({        
            type: "POST",
            url: "@Url.Action("Create","Project")",
            data:{"json": JSON.stringify(list)},
            dataType: "json",
            success: function (r) {
                alert(r + " record(s) inserted.");
            }
        });
    });

您可以在您的Create 方法中像这样接收您的Model：确保导入 System.Web.Script.Serialization 命名空间：

using System.Web.Script.Serialization

[HttpPost]
public JsonResult Create(string json)
{
    var serializer = new JavaScriptSerializer();
    dynamic jsondata = serializer.Deserialize(json, typeof(object));
    List<string> myfieldName=new List<string>();
    //Access your array now
    foreach (var item in jsondata)
    {
      myfieldName.Add(item["myfieldName"]);
    }

    //Do something with the list here
    return Json("Success");
}

希望对你有所帮助。

【讨论】：

就像一个魅力，我收到带有数据的 json 字符串，现在我必须弄清楚为什么我的解决方案无法识别使用 System.Web.Script.Serialization。

【解决方案2】：

另一种方法是使用不显眼的 AJAX。您只需要从 Nuget 包管理器安装 Microsoft jQuery unobtrusive AJAX。

然后，在您看来，调用以下代码：

@{using (Ajax.BeginForm("Create", "ControllerName", null, new AjaxOptions()
     {
          HttpMethod = "POST",
          // ...
     }
}))
{
     // Html code goes here
}

并确保在视图底部包含此内容：

<script src="~/Scripts/jquery.unobtrusive-ajax.js"></script>

然后，您可以为控制器设置正常的 ActionResult（而不是 JsonResult）并接受 List 列表的参数。

【讨论】：