MVC模型绑定在AJAX请求的复杂类型上未按预期工作

本文关键字：工作 类型 复杂 绑定 模型 AJAX 请求 MVC | 更新日期: 2023-09-27 18:21:23

我有一个"ViewModel"要传递给我的操作，它看起来像这样：

public class MyClass
{
    public int Id { get; set; }
    public int MyNumber { get; set; }
}
public class RequestViewModel
{
    public List<MyClass> MyClasses { get; set; }
    public int AnotherNumber { get; set; }
}

在javascript中，我定义我的数据如下：

       var actionRequest = {
            MyClasses: [
                {
                    Id: 1,
                    MyNumber: 30
                },
                {
                    Id: 2,
                    MyNumber: 40,
                }
            ],
            AnotherNumber: 12
        };

我打电话：

    $.ajax({
        type: "Get",
        url: " /Controller/MyAction",
        data: actionRequest,
        dataType: "json",
        traditional: true,
        success: function (data) {
            // Good stuff
        },
        error: function (data) {
            // Bad stuff
        }
    });

我的行动签名：

public ActionResult MyAction(RequestViewModel request)

在检查request（我的操作成功命中）时，会填充AnotherNumber，而我的MyClass集合是null。

我错过了一些显而易见的东西，我只是不知道是什么。

编辑

我真的很感激到目前为止的建议和答案，但（到目前为止）都没有奏效，所以现在我只能接受：

public class RequestViewModel
{
    public int[] MyClassIds { get; set; }
    public int[] MyNumberValues { get; set; }
    public int AnotherNumber { get; set; }
}

这样做感觉很可怕，但现在这是一个有点紧迫感的项目，所以我必须采取有效的方法。

MVC模型绑定在AJAX请求的复杂类型上未按预期工作

尝试下面的代码，并将名称与控制器中的名称相同，如下所示：-

$.ajax({
        type: "POST",
        url: " /Controller/MyAction",
        data: :{ request : JSON.stringify(actionRequest) },
        dataType: "json",
        traditional: true,
        success: function (data) {
            // Good stuff
        },
        error: function (data) {
            // Bad stuff
        }
    });

我建议尝试POST请求，将httpPost属性放在操作方法之上，如下所示：-

[HttpPost]
public ActionResult MyAction(RequestViewModel request)

尝试使用JSON.stringify并在ajax请求中将data修改为：

data:{ request : JSON.stringify(actionRequest) }

并在ajax请求中添加contentType: "application/json"。

或者试试这个：

var request = {
        MyClasses: [
            {
                Id: 1,
                MyNumber: 30
            },
            {
                Id: 2,
                MyNumber: 40,
            }
        ],
        AnotherNumber: 12
    };
 request = JSON.stringify({ 'request': request });

现在以这种方式在ajax请求中使用data：

data: request

我不确定差异在哪里，现在我无法重现错误，但这对我有效。

public class MyClass
{
    public int Id { get; set; }
    public int MyNumber { get; set; }
}
public class RequestViewModel
{
    public List<MyClass> MyClasses { get; set; }
    public int AnotherNumber { get; set; }
}
[HttpPost]
public ActionResult Save(RequestViewModel actionRequestX)
{
        return null;
}
var actionRequest = {
        MyClasses: [
            {
                Id: 1,
                MyNumber: 30
            },
            {
                Id: 2,
                MyNumber: 40
            }
        ],
        AnotherNumber: 12
    };
    $.ajax({
    type: "POST",
    url: "/Home/Save",
    contentType: "application/json, charset=utf-8",
    data: JSON.stringify({ actionRequestX: actionRequest }),
    dataType: "json",
    traditional: true,
    success: function (data) {
        // Good stuff
    },
    error: function (data) {
        // Bad stuff
    }
});
});
相关文章：