Как связать массив JavaScript из JSON объектов со списком объектов в viewModel. dotnetcore mvc

Question

Это мой javascript массив json объектов

var pObjIds = [{"Id":"2","Name":"small"},{"Id":"3","Name":"average"}]

Я собрал свои поля формы в FormData () следующим образом

var form = new FormData($(this)[0]);

Я добавил массив json объектов к FormData следующим образом

form.append("Availability", pObjIds);

У меня есть ViewModel со свойством

public List<Item> Availability { get; set; }

Класс Item выглядит следующим образом

public class Item
{
    [JsonProperty(PropertyName = "Id")]
    public int Id { get; set; }

    [JsonProperty(PropertyName = "Name")]
    public string Name { get; set; }
}

Мой метод контроллера для получения данных формы:

[HttpPost]
public IActionResult AddSupplier(SupplierVM vm, List<Item> list)
{
  if (ModelState.IsValid)
  {
  }
   return View("AddSupplier", vm);
}

Мое намерение состоит в том, чтобы связать добавленную доступность в formData со свойством public List<Item> Availability { get; set; } в ViewModel.

Приведенный выше код - это то, что я пробовал, но это не обязательно. Всегда возвращать count = 0 для доступности.

Я делаю что-то не так или есть лучший способ сделать это? Я использовал FormCollection в контроллере, но все еще не видел добавленный массив объектов json, но я могу войти в него в консоли и увидеть, что он успешно добавлен.

Я использую do tnet core 3.0 mvc.

Заранее спасибо.

Это код на стороне клиента, который вызывает AddSupplier

var form = new FormData($(this)[0]);
                form.append("Availability", pObjIds);
                $.ajax({
                    type: 'POST',
                    url: '/supplier/addsupplier/',
                    data: form,
                    processData: false,
                    contentType: false,
                    datatype: 'json',
                    success: function (result) {
                        if (result.status == false) {
                            swal({
                                title: 'Error!',
                                text: result.msg,
                                icon: "error",
                                button: "Ok",
                            });
                        }
                    },
                    error: function () {
                        swal({
                            title: "Unknown Error!",
                            text: "unable to process request!",
                            icon: "error",
                            button: "Ok",
                        });
                    }
                });

Answer 1

У меня есть ViewModel со свойством

public List<Item> Availability { get; set; }

Мое намерение - привязать добавленную доступность в formData к свойству public List<Item> Availability { get; set; } в ViewModel.

Чтобы удовлетворить ваши требования, вы можете попробовать добавить значения для объекта FormData, как показано ниже.

var form = new FormData($(this)[0]);

//form.append("Availability", pObjIds);

$(pObjIds).each(function (index, el) {
    form.append(`Availability[${index}].Id`, el.Id);
    form.append(`Availability[${index}].Name`, el.Name);
});


$.ajax({
    type: 'POST',
    url: '/supplier/addsupplier/',
    data: form,
    processData: false,
    contentType: false,
    datatype: 'json',
    success: function (result) {
        // code logic here
        //...

В действии контроллера AddSupplier

[HttpPost]
public IActionResult AddSupplier(SupplierVM vm)
{
    //code logic here

Просмотр класса модели SupplierVM

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

    //other properties

    public List<Item> Availability { get; set; }
}

Результат теста