ASP.NET Core 2.2 中的 AJAX POST 请求未将数据传递给控制器​​方法

Question

在开始之前，我想说 - 我意识到这个问题与本网站上发布和回答的许多其他问题非常相似。我已通读并尝试了尽可能多的与我的问题相关的解决方案，但到目前为止都没有奏效。

我正在尝试将数据从我的网页传递到控制器方法。网页非常简单，只需要捕获用户输入的信息并发送出去。我正在使用 Telerik 的 Kendo Grid 来绑定和组织我的数据。但是，无论我尝试什么，我的 AJAX 发布请求都不会正确传递参数。使用浏览器的调试器时，我可以看到传递给 AJAX 请求的参数是有效的，但是当它们在控制器方法中到达我的断点时，它们都是 null 或默认值。

包含 AJAX 请求的函数

function saveShiftDataToServer() {
    var grid = $("#myGrid").data("kendoGrid");
    var dataSource = grid.dataSource;
    var allData = dataSource.data();
    var comments = '@Model.Comments';
    var loadInfoCorrect = '@Model.LoadInfoCorrect';

    $.ajax({
        type: "POST",
        url: '/Home/SaveData',
        data: JSON.stringify({ accessorials: allData, comments: comments, loadInfoCorrect: loadInfoCorrect }),
        contentType: "application/json; charset=utf-8",
        datatype: "json"
    })
}

控制器方法

[AcceptVerbs("Post")]
public ActionResult SaveData(Accessorial[] accessorials, string comments, bool loadInfoCorrect)
{
    // Code removed for brevity
}

我的 Kendo Grid 被键入为 Accessorial（第一个控制器方法参数类型），所以我的假设是检索所有当前行的集合应该返回该模型的数组。即便如此，“cmets”是一个字符串，但只会作为 null 传递给控制器​​方法。

我是 ASP.NET Core 和 Kendo 的新手，所以我确信我缺少一些明显的东西。任何帮助将不胜感激！

Answer 1

感谢所有回复！通过将 AJAX 数据类型更改为“文本”并简单地将 JSON 直接传递给反序列化服务器端，我终于能够在控制器中看到有效数据。出于某种原因，这是迄今为止我能够完成这项工作的唯一方法。

AJAX POST 调用

function saveShiftDataToServer() {
    var grid = $("#accessorialGrid").data("kendoGrid");
    var dataSource = grid.dataSource;
    var allData = dataSource.data();

    var shiftOverview = {
        ShiftId: 0,
        UserName: "test",
        ShiftDate: null,
        LoadList: null,
        AccessorialList: allData,
        LoadInfoCorrect: true,
        Comments: ""
    };        
    var jsonData = JSON.stringify(shiftOverview);

    $.ajax({
        type: "POST",
        url: '/Home/SaveData',
        data: { json: jsonData },
        datatype: "text",
        success: function (response) {
                alert("111");
            }
        })
}

控制器方法

[AcceptVerbs("Post")]
public ActionResult SaveData(string json)
{
    JsonConvert.DeserializeObject<ShiftOverview>(json); // This produces an object with valid data!
}

Answer 2

您可以在 ViewModel 中传递您的所有数据，并使用[FromBody] on action 访问它

public class ViewModel
    {
        public List<Accessorial> Accessorials{ get; set; }
        public string Comments { get; set; }
        public bool LoadInfoCorrect { get; set; }
    }

阿贾克斯：

var model = {};//pass all you data to an object
        model.Accessorials = allData ;
        model.comments = comments ;
        model.loadInfoCorrect = loadInfoCorrect;

        var items = JSON.stringify(model);        

        $.ajax({
            url: '/GetAllCustDetails/SaveData',
            type: "POST",
            data: items,
            contentType: 'application/json; charset=utf-8',
            //dataType: "json",
            success: function (response) {
                alert("111");
            }
        });

控制器：

[HttpPost]
public ActionResult SaveData([FromBody]ViewModel model)

Answer 3

您正在传递与C# 对应的JSON 对象，如下所示：

public class Model {
    public Accessorial[] Accessorials { get; set; }
    public string Comments { get; set; }
    public bool loadInfoCorrect { get; set; }
}

尝试在上面声明这样的类并以这种方式调整您的操作方法：

public ActionResult SaveData(Model model)
{
    // Code removed for brevity
}

如果没有帮助 - 制作模型参数 object 并在调试模式下检查您从 AJAX 调用中获得的信息。

Answer 4

您必须在您的操作方法中使用 [FromBody] 属性，如下所示：

[HttpPost]
public ActionResult SaveData([FromBody]Model model)
{
    // Code removed for brevity
}