ASP.NET Core使用Datatables列数正确却提示未知参数错误

错误根因 #

• 字段大小写不匹配：后端SessionGridViewModel的属性名是大写开头（Id/Name/StartDate/EndDate），但前端Datatables配置的data字段是小写开头，Datatables找不到对应字段就会触发「Requested unknown parameter」报错。
• 操作列未配置默认值：最后两列编辑、删除按钮没有绑定对应data字段，Datatables默认会尝试从返回数据中读取对应字段，找不到就会报错。
• 返回数据多出prototype列是ASP.NET Core默认Json序列化配置导致的：默认启用了驼峰命名转换，部分场景下序列化会额外输出原型相关字段，同时也加重了前后端字段大小写不匹配的问题。

修复步骤 #

1. 修正前端Datatables配置 #

调整字段大小写，同时给操作列增加defaultContent和不可排序配置：

$(document).ready(function () {
    $("#example").DataTable({
        "processing": true, // 显示进度条    
        "serverSide": true, // 开启服务端处理    
        "filter": true, // 启用搜索框过滤器
        "orderMulti": false, // 禁止同时对多列排序    
        "ajax": {
            "url": "/Bookings/LoadData",
            "type": "POST",
            "datatype": "json"
        },
        "columns": [
            { "data": "Id", "name": "Id", "autoWidth": true },
            { "data": "Name", "name": "Name", "autoWidth": true },
            { "data": "StartDate", "name": "StartDate", "autoWidth": true },
            { "data": "EndDate", "name": "EndDate", "autoWidth": true },          
            {
                "render": function (data, type, full, meta) { return '<a class="btn btn-info" href="/Demo/Edit/' + full.Id + '">Edit</a>'; },
                "defaultContent": "",
                "orderable": false
            },
            {
                data: null, 
                render: function (data, type, row) {
                    return "<a href='#' class='btn btn-danger' onclick=DeleteData('" + row.Id + "'); >Delete</a>";
                },
                "defaultContent": "",
                "orderable": false
            }
        ]
    });
});

2. 修正后端Json序列化配置 #

修改LoadData接口的返回逻辑，指定序列化时保持属性名大小写不变，避免自动转驼峰和输出多余字段。
如果项目用的是默认System.Text.Json：

return Json(new { 
    draw = draw, 
    recordsFiltered = recordsTotal, 
    recordsTotal = recordsTotal, 
    data = data 
}, new JsonSerializerOptions { 
    PropertyNamingPolicy = null, // 保持属性名和C#类一致，不自动转驼峰
    IgnoreNullValues = true
});

如果项目用的是Newtonsoft.Json：

return Json(new { 
    draw = draw, 
    recordsFiltered = recordsTotal, 
    recordsTotal = recordsTotal, 
    data = data 
}, new JsonSerializerSettings { 
    ContractResolver = new DefaultContractResolver(),
    NullValueHandling = NullValueHandling.Ignore
});

3. 可选修复JS路径问题 #

如果Delete相关JS代码是写在独立的.js文件中，@Url.Content("~")是Razor语法，不会被解析，会导致删除请求路径错误。可以在视图中先定义全局变量传递站点根路径，再在JS中调用。

内容的提问来源于stack exchange，提问作者dotnetdevcsharp