DataTables 请求的未知参数 'PageId'

DataTables Requested unknown parameter 'PageId'

我 运行 在尝试加载 DataTables 对象数据 (https://datatables.net/manual/data/) 时遇到以下错误:

DataTables warning: table id=report-table - Requested unknown parameter 'PageId' for row 0, column 0. For more information about this error, please see http://datatables.net/tn/

下面是示例 json 我从我的 C# SchemaReport/GetReportJson 控制器接收并在 JQuery ajax 成功回调中使用以初始化我的数据表的数据:

[{"PageId":"foo","SchemaName":"foo","Name":"foo","LastModified":"foo","LastModifiedUser":"foo"}]

数据表HTML:

<table id="report-table" class="display nowrap" style="width:100%">
    <thead>
        <tr>
            <th>Page ID</th>
            <th>Schema</th>
            <th>Name</th>
            <th>Last Modified</th>
            <th>Last Modified User</th>
        </tr>
    </thead>
    <tfoot>
        <tr>
            <th>Page ID</th>
            <th>Schema</th>
            <th>Name</th>
            <th>Last Modified</th>
            <th>Last Modified User</th>
        </tr>
    </tfoot>
</table>

JQuery ajax 和 DataTables 初始化脚本:

<script>
    $(function () {
        $("button#report-form-submit").click(function () {
            event.preventDefault();
            var data = $("form#report-form").serialize();
            $.ajax({
                type: "POST",
                url: "@Url.Action("GetReportJson", "Report")",
                data: data,
                dataType: "json",
                beforeSend: function (data) {
                },
                success: function (data) {
                    // Report DataTables Init
                    // ===========================================
                    $('#report-table').DataTable({
                        data: data,
                        columns : [
                            {
                                data : 'PageId'
                            },
                            {
                                data : 'SchemaName'
                            },
                            {
                                data : 'Name'
                            },
                            {
                                data : 'LastModified'
                            },
                            {
                                data : 'LastModifiedUser'
                            }
                        ],
                        dom: 'Bfrtip',
                        buttons: [
                            {
                                extend: 'csv',
                                text: 'Download CSV',
                                filename: 'report-file'
                            },
                            {
                                extend: 'excel',
                                text: 'Download Excel',
                                filename: 'report-file',
                                title: ''
                            },
                        ]
                    });
                },
                error: function (XMLHttpRequest, textStatus, errorThrown) {
                },
                complete: function (data) {
                }
            });
        });
    });
</script>

我注意到在确认错误后 DataTables 加载如下并说明 134 个条目:

134 匹配 json 数据的字符数(在答案中提供)。出于某种原因,DataTables 似乎没有看到 json 对象并解析单个字符?只是不确定为什么要这样做?

您的 columns 区块应该是:

                    columns : [
                        {
                            'data' : 'PageId'
                        },
                        {
                            'data' : 'SchemaName'
                        },
                        {
                            'data' : 'Name'
                        },
                        {
                            'data' : 'LastModified'
                        },
                        {
                            'data' : 'LastModifiedUser'
                        }
                    ],

您还应该像这样从 Controller 发送数据:

return Json(schemaData);

当您 returning a JSON 时不需要序列化您的数据,因为这已经 return JSON 格式的数据,如果您使用 JsonConvert.SerializeObject 然后你将它转换两次,DataTable 插件不喜欢。