Как отправить список массивов объектов в контроллер через ajax

Question

У меня есть объект в моем JavaScript с массивом объектов внутри него. Я хочу отправить его на мой контроллер через вызов ajax. Но мой список никогда не заполняется в моем контроллере. Я делаю свой объект machineList следующим образом:

 var machineList = JSON.stringify({ 'machineList': objects.machines });

Console.log этого объекта

{"machineList":[{"Id":1,"Labour":"Hard","EnlistedMachine":"BEXTE","Type":"dz","Identifier":"ddd","IdentifierCode":"ddd"},{"Id":2,"Labour":"Easy","EnlistedMachine":"BEXTEss","Type":"dz","Identifier":null,"IdentifierCode":null}]}

Мой объект данных, который отправляется, выглядит следующим образом

 var data = {

        SalesPrice: $("#SalesPrice").val(),
        machineList: machineList

    };

Ajax call:

   $.ajax({
        url: currenturl + "/MyXmlAction",
        data: data,
        dataType: "json",
        type: "GET",
        contentType: 'application/json; charset=utf-8', //define a contentType of your request
        cache: false,
        success: function (type) {
            // data is your result from controller
            if (type.success) {
                XML = type.json;

            }
        },
        error: function (xhr) {
            alert('error');
        }
    });

Моя модель выглядит так:

    public class ContractViewModel
    {
  public string SalesPrice { get; set; }
  List<MachineListDto> machineList = new List<MachineListDto>();
     }

Мой метод контроллера выглядит так:

public ActionResult MyXmlAction(ContractViewModel data)
{
    //Code
    return Json(new { success = true, data }, JsonRequestBehavior.AllowGet);
}

MachineListDto

    public class MachineListDto
    {
        public int Id { get; set; }

        public string EnlistedMachine { get; set; }

        public string Type { get; set; }

        public string Labour { get; set; }

        public string Identifier { get; set; }

        public string IdentifierCode { get; set; }
    }
}

Объект данных после внесенных изменений Tetsuya

{"SalesPrice":"1000","machineList":[{"Id":1,"Labour":"Hard","EnlistedMachine":"BEXTE","Type":"dz","Identifier":"ddd","IdentifierCode":"ddd"},{"Id":2,"Labour":"Easy","EnlistedMachine":"BEXTEss","Type":"dz","Identifier":null,"IdentifierCode":null}]}

Я пытался сделать то же самое, что видел в следующем посте: Передача ListObject в контроллер

Answer 1

У вас есть 3 основных проблемы с кодом:

1) contentType в вызове AJAX, установленном как application/json; charset=utf-8, означает, что переданные данные должны быть строкой JSON, но вместо этого вы передаете объект. Вам необходимо отправить оба объекта в виде строки JSON, указав JSON.stringify() для всего определения объекта:

var data = JSON.stringify({
    SalesPrice: $("#SalesPrice").val(),
    machineList: objects.machines
});

2) Объявление List<MachineListDto> machineList = new List<MachineListDto>(); определяет поле, а не свойство, которое необходимо для сериализации. Он должен быть объявлен как свойство:

public class ContractViewModel
{
    public string SalesPrice { get; set; }
    List<MachineListDto> machineList { get; set; } // define as property
}

3) Тип обратного вызова AJAX установлен как GET, что означает, что он будет отправлять в виде строки запроса, которая не рекомендуется передавать объекты коллекции. Вам необходимо использовать type: 'POST' в обратном вызове AJAX и установить атрибут [HttpPost] в действии контроллера:

AJAX

$.ajax({
    url: currenturl + "/MyXmlAction",
    data: data,
    dataType: "json",
    type: "POST", // use POST request
    contentType: 'application/json; charset=utf-8', //define a contentType of your request
    cache: false,
    success: function (type) {
        // data is your result from controller
        if (type.success) {
            XML = type.json;

        }
    },
    error: function (xhr) {
        alert('error');
    }
});

Действие контроллера

[HttpPost]
public ActionResult MyXmlAction(ContractViewModel data)
{
    // do something
    return Json(new { success = true, data }, JsonRequestBehavior.AllowGet);
}

Answer 2

var pushSalesprice = [];
var Machinelist_data = [];
pushSalesprice.push($("#SalesPrice").val());
Machinelist_data.push(machineList);
var data = {
  SalesPrice: pushSalesprice ,
  machineList: Machinelist_data 
};