Получить значение из флажков и отправить его как список в контроллер

Проверьте код ниже. Я отправляю список ProductId на свой контроллер и хотел получить его с моделью представления под названием UpdateProductStatus. но проблема с моим текущим кодом: ajax успешно отправляет его на контроллер, но UpdateProductStatus не может получить какое-либо значение ProductId. Это всегда возвращает ноль. Что я здесь делаю не так? Возможно, в ajax я ошибаюсь, я думаю. Как я могу исправить это, чтобы получить все ProductId в качестве контроллера формы списка? заранее спасибо

Контроллер:

[HttpPost]
        public IActionResult UpdateProductStatus([FromBody]List<UpdateProductStatus> UpdateProductStatus)
        {



            return Json("ok");
        }

Просмотреть модель:

using System;
using System.Collections.Generic;
using System.Linq;
using System.Threading.Tasks;

namespace BlexzWeb.ViewModels
{
    public class UpdateProductStatus
    {
        public int ProductId { get; set; }
    }

}

JQuery:

 $('#btnActivate').on('click', function () {


            var allSelectedProductId = [];
            var allSelectedProductIdWithKey = [];
            $('.chkItems:checked').each(function() {
                allSelectedProductId.push($(this).val());
            });

            for (var _allSelectedProductId in allSelectedProductId) {
                allSelectedProductIdWithKey.push('ProductId'+':'+_allSelectedProductId);
            }

            console.log(allSelectedProductIdWithKey);



            //var things = JSON.stringify(allSelectedProductIdWithKey);
            var things = JSON.stringify({ 'UpdateProductStatus': allSelectedProductIdWithKey });


            console.log(things);

            $.ajax({
                contentType: 'application/json; charset=utf-8',
                dataType: 'json',
                type: 'POST',
                url: '/Products/UpdateProductStatus',
                data: things,
                success: function () {
                    console.log('sssss');
                },
                failure: function (response) {
                    console.log('fffff');
                }
            });

HTML:

                                        <input type="checkbox" class="chkItems" value="1">
                                        <input type="checkbox" class="chkItems" value="2">
<button id="btnActivate">Button</button>
1
0
37
2
Перейти к ответу Данный вопрос помечен как решенный

Ответы 2

Чтобы выполнить привязку к методу вашего контроллера, вам необходимо отправить массив объектов, содержащий пару имя / значение для ProductId. Чтобы создать свой массив объектов, используйте

$('#btnActivate').on('click', function () {
    var allSelectedProductId = [];
    $('.chkItems:checked').each(function() {
        allSelectedProductId.push({ ProductId: $(this).val() });
    });
    var things = JSON.stringify({ UpdateProductStatus: allSelectedProductId });

    $.ajax({
        contentType: 'application/json; charset=utf-8',
        dataType: 'json',
        type: 'POST',
        url: '/Products/UpdateProductStatus',
        data: things,
        success: function () {
            ....
    });
});
Ответ принят как подходящий

Ваш текущий код отправляет полезную нагрузку, как показано ниже, для вызова ajax.

{"UpdateProductStatus":["ProductId:0","ProductId:1"]}

Аргумент вашего метода действия - это список объектов UpdateProductStatus. Итак, чтобы привязка модели работала правильно с вашей текущей сигнатурой параметра метода действия, ваша полезная нагрузка должна быть такой, как показано ниже.

[{"ProductId":"1"},{"ProductId":"2"}]

Имя параметра указывать не нужно. Просто передайте массив элементов, каждый из которых имеет свойство ProductId и его значение.

var allSelectedProductIdWithKey = [];
$('.chkItems:checked').each(function () {
    allSelectedProductIdWithKey.push({ ProductId: $(this).val() });
});

var things = JSON.stringify(allSelectedProductIdWithKey);

$.ajax({
    contentType: 'application/json; charset=utf-8',
    type: 'POST',
    url: '/Products/AppendClientFilter',
    data: things,
    success: function (res) {
        console.log('Successs', res);
    },
    failure: function (response) {
        console.log('Error', response);
    }
});

Вы также можете удалить dataType в вызове ajax. jQuery ajax угадает правильный тип из заголовка ответа, и в вашем случае вы собираетесь явно вернуть JSON.

Другие вопросы по теме