ASP.Net Core Razor Ajax 请求 JSON 值空

Question

我正在为我的应用程序使用 .Net Core razor。

当我从 Ajax 调用控制器操作时，我传递给控制器的值变为 null。

这是我的脚本：

var table = $('#dataTable').DataTable();
var data = table.$('input[type="checkbox"]').serializeArray();
console.log(data);

var data_json = JSON.stringify({ 'data_json': data });
console.log(data_json);

        $.ajax({
            contentType: "application/json; charset=utf-8",
            dataType: 'json',
            type: "GET",
            url: '@Url.Action("UpdateChart","Home")',
            data: data_json,
            cache: false,
            success: function (result) {
                myFunction(result);
                chart.render();
                console.log(result);
            }
        });
    }

我只是获取选中复选框的值并将它们转换为 JSON。

我的控制器是：

[HttpGet]
        public JsonResult UpdateChart(List<CheckBoxArray> data_json)
        {
            ChartRepository repository = new ChartRepository();
            string deviceSerialNo = HttpContext.Session.GetString("currentSerialNumber") != null ? HttpContext.Session.GetString("currentSerialNumber").ToString() : "1606008363";
            string query = repository.PrepSelectQuery("1", deviceSerialNo, "2021-03-04 10:04:55.544398", "2021-03-05 10:46:55.544398");
            GeneralObjects.ServiceResponse response = repository.GetChartData(query);

            TempData["AllData"] = response.This_Object;
            return Json(new { myData = response.This_Object.ToString() });
        }

public class CheckBoxArray
    {
        public string Name { get; set; }
        public string Value { get; set; }
    }

这里的列表 data_json 是空的。然而，数据是这样的：

{"data_json":[{"name":"chkBox","value":"1"},{"name":"chkBox","value":"4"},{"name":"chkBox","value":"7"}]}

我这里有什么问题无法获取值？

Answer 1

When I call the controller action from my Ajax, the value I pass comes null to the controller.

根据您的代码，我们可以发现您希望将 CheckBoxArray 对象的列表从 ajax 客户端传递到控制器，并且您将请求方法设置为 GET]，这将通过查询字符串传递数据。

为了达到要求并使数据能够按预期绑定到操作参数List<CheckBoxArray> data_json，您可以尝试修改客户端代码以根据您的json数组动态生成查询字符串数据，如下所示。

var qparam = "";

for (var i = 0; i < data.length; i++) {
    qparam += "data_json[" + i + "].name=" + data[i].name + "&data_json[" + i + "].value=" + data[i].value + "&";
}

$.ajax({
    contentType: "application/json; charset=utf-8",
    dataType: 'json',
    type: "GET",
    url: '@Url.Action("UpdateChart","Home")?' + qparam.substring(0, qparam.length - 1),
    cache: false,
    success: function (result) {
        myFunction(result);
        chart.render();
        console.log(result);
    }
});

有关模型绑定及其工作原理的详细信息，请查看此文档：https://docs.microsoft.com/en-us/aspnet/core/mvc/models/model-binding?view=aspnetcore-5.0#collections

测试结果

ASP.Net Core Razor Ajax 请求 JSON 值空

ASP.Net Core Razor Ajax Request JSON value null

ajax

jquery

json

razor

asp.net-core