I'm trying To Send Array with Serialize Form as a parameter from ajax to controller but the second parameter "test" giving null value

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 Code Image`

-----------

I'm trying To Send Array with Serialize Form as a parameter from ajax to controller but the second parameter "test" giving null value So, the problem is that controller doesn't get the parameter test, I've tried many examples and tutorials but nothing helped. maybe there's some easy obvious mistake which I am missing? How could I pass parameters from ajax function to controller?

Answer 1

If you want to pass an array like query parameter for POST request you need to add [FromQuery] attribute to list parameter in you controller method. Instead it's better to put json payload to request body.