我正在尝试将带有序列化形式的数组作为参数从ajax发送到控制器，但第二个参数“test”是给出空值

Question

$("#CreateDepartmentForm").submit(function (e) { e.preventDefault();

        var modelx = $(this).serialize();
        console.log(modelx);
        var cars = [
            {
                "color": "purple",
                "type": "minivan",
                "registration": "2018-03-03",
                "capacity": 7
            },
            {
                "color": "red",
                "type": "station wagon",
                "registration": "2018-03-03",
                "capacity": 20
            }];
       
        $.ajax({
            type: "POST",
            url: "/Department/CreateDepartmentByAjax",
            data: modelx + "&test=" + cars,
            success: function (res) {
            },
         });

---

public IActionResult CreateDepartmentByAjax(DepartmentVM model,List<cars> test)
    {
     }

---

   public  class cars
{
    public string color  { get; set; }
    public string type { get; set; }
    public string registration { get; set; }
    public int capacity { get; set; }
}

---

Ajax 代码图像`

-----------

我正在尝试将具有序列化形式的数组作为参数从ajax发送到控制器，但第二个参数“test”给出空值 所以，问题是控制器没有得到参数测试，我尝试了很多示例和教程，但没有任何帮助。也许我遗漏了一些简单明显的错误？如何将参数从 ajax 函数传递到控制器？

Answer 1

通过将对象序列化为 JSON 将对象传递给 API。

$("#CreateDepartmentForm").submit(function (e) {
    e.preventDefault();

    var modelx = {};
    $(this).children("input").each(function () {
        var name = $(this).attr('name');
        var value = $(this).val();
        modelx[name] = value;
    });

    ...
      

    $.ajax({
        type: "POST",
        url: "/Department/CreateDepartmentByAjax",
        contentType: "application/json",
        data: JSON.stringify({ model: modelx, test: cars }),
        success: function (res) {
        },
    });
});

并修改控制器：

public class CreateDepartmentInput
{
    public DepartmentVM model { get; set; }
    public List<cars> test { get; set; }
}

[HttpPost]
public IActionResult CreateDepartmentByAjax([FromBody]CreateDepartmentInput input)
{
    ...
}

请求负载

Visual Studio 调试输出

Answer 2

如果您想为 POST 请求传递类似数组的查询参数，您需要在控制器方法中添加 [FromQuery] 属性来列出参数。相反，最好将 json 有效负载放入请求正文中。