JS数据表返回空行

Question

我的数据表返回 982 个空行，我真的不知道为什么！我也收到此错误消息：

"Requested unknown parameter 'Key' for row 0, column 0."

我查看了控制台，这是我的数据表从 ajax:

获取的数据

{ "data": [ {"Summary":"Create lists of useful fields", "Created":"11/06/2020 13:03:36", "Updated":"18/01/2021 07:48:56", "Status":"Done", "Key":"PGT-2766", "Assignee":"Jane Doe", "Priority":"Lowest", "reporter":"Dave" },{"Summary":"test", "Created":"13/01/2021 14:30:04", "Updated":"13/01/2021 14:30:06", "Status":"To Do", "Key":"PGT-4622", "Assignee":"admin_user", "Priority":"Low", "reporter":"Dave" },{"Summary":"Review Rolling Programme queues/filters", "Created":"15/02/2021 14:32:21", "Updated":"08/03/2021 08:08:12", "Status":"In Progress", "Key":"PGT-5185", "Assignee":"Jane Doe", "Priority":"High", "reporter":"Dave" },{"Summary":"External LUSI Change Request Form: Bob - 19/1/2021", "Created":"19/01/2021 15:32:02", "Updated":"03/06/2021 08:59:17", "Status":"To Do", "Key":"PGT-4711", "Assignee":"admin_user", "Priority":"Low", "reporter":"Dave" } ] }

这是我的数据表：

 var table = $('#example').DataTable({
            ajax: {
                url: pageUrl,
                type: 'POST',
                contentType: 'application/json; charset=utf-8',
                dataType: "json",
                dataSrc: function (data) {
                    console.log(data.d);
                    return (data.d);
                }
            },
            "pageLength": 50,
            fixedHeader: true,
            responsive: true,
            "columns": [
                { "data": "Key" },
                { "data": "Summary" },
                { "data": "Created" },
                { "data": "Updated" },
                { "data": "Status" },
                { "data": "Priority" },
                { "data": "reporter" },
                { "data": "Assignee" }
            ],
            autoWidth: false,
            "columnDefs": [
                { "width": "50%", "targets": 0 },
                { "width": "5%", "targets": 1 },
                { "width": "5%", "targets": 2 },
                { "width": "5%", "targets": 3 },
                { "width": "5%", "targets": 4 },
                { "width": "5%", "targets": 5 }
            ],
            "order": [[1, 'asc']],
            "success": fnsuccesscallback,
            "error": fnerrorcallback
        });

        function fnsuccesscallback(data) {
            alert(data.d);

        }

        function fnerrorcallback(result) {
            alert(result.statusText);
        }

真的很希望有人能帮助我，因为我真的被困住了！！！

Answer 1

这是你想要的吗？此错误将指示使用 columns.data 的列无法获取要显示的有效数据 - 例如：如果该行的数据源对象没有 Name 参数或数据为 null 或未定义，则会产生此错误.

var data = [
    {
      "Summary": "Create lists of useful fields",
      "Created": "11/06/2020 13:03:36",
      "Updated": "18/01/2021 07:48:56",
      "Status": "Done",
      "Key": "PGT-2766",
      "Assignee": "Jane Doe",
      "Priority": "Lowest",
      "reporter": "Dave"
    },
    {
      "Summary": "test",
      "Created": "13/01/2021 14:30:04",
      "Updated": "13/01/2021 14:30:06",
      "Status": "To Do",
      "Key": "PGT-4622",
      "Assignee": "admin_user",
      "Priority": "Low",
      "reporter": "Dave"
    },
    {
      "Summary": "Review Rolling Programme queues/filters",
      "Created": "15/02/2021 14:32:21",
      "Updated": "08/03/2021 08:08:12",
      "Status": "In Progress",
      "Key": "PGT-5185",
      "Assignee": "Jane Doe",
      "Priority": "High",
      "reporter": "Dave"
    },
    {
      "Summary": "External LUSI Change Request Form: Bob - 19/1/2021",
      "Created": "19/01/2021 15:32:02",
      "Updated": "03/06/2021 08:59:17",
      "Status": "To Do",
      "Key": "PGT-4711",
      "Assignee": "admin_user",
      "Priority": "Low",
      "reporter": "Dave"
    }
];

var table = $('#example').DataTable({
            data: data,
            "pageLength": 50,
            fixedHeader: true,
            responsive: true,
            "columns": [
                { "data": "Key" },
                { "data": "Summary" },
                { "data": "Created" },
                { "data": "Updated" },
                { "data": "Status" },
                { "data": "Priority" },
                { "data": "reporter" },
                { "data": "Assignee" }
            ],
            autoWidth: false,
            "columnDefs": [
                { "width": "50%", "targets": 0 },
                { "width": "5%", "targets": 1 },
                { "width": "5%", "targets": 2 },
                { "width": "5%", "targets": 3 },
                { "width": "5%", "targets": 4 },
                { "width": "5%", "targets": 5 }
            ],
            "order": [[1, 'asc']],
            "success": fnsuccesscallback,
            "error": fnerrorcallback
        });

        function fnsuccesscallback(data) {
            alert(data.d);

        }

        function fnerrorcallback(result) {
            alert(result.statusText);
        }

<link rel="stylesheet" type="text/css" href="https://cdn.datatables.net/v/bs4/jszip-2.5.0/dt-1.10.25/b-1.7.1/b-colvis-1.7.1/b-html5-1.7.1/b-print-1.7.1/r-2.2.9/rg-1.1.3/datatables.min.css"/>

 <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.6.0/jquery.min.js" referrerpolicy="no-referrer"></script>

<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/pdfmake/0.1.36/pdfmake.min.js"></script>
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/pdfmake/0.1.36/vfs_fonts.js"></script>
<script type="text/javascript" src="https://cdn.datatables.net/v/bs4/jszip-2.5.0/dt-1.10.25/b-1.7.1/b-colvis-1.7.1/b-html5-1.7.1/b-print-1.7.1/r-2.2.9/rg-1.1.3/datatables.min.js"></script>
 <div class ="container">
            <table id="example" class="table table-bordered" cellspacing="0" width="100%">
                <thead class="thead-dark">
                    <tr>
                    <th>Key</th>
                    <th>Summary</th>
                    <th>Created</th>
                    <th>Updated</th>
                    <th>Status</th>
                    <th>Priority</th>
                    <th>Reporter</th>
                    <th>Assignee</th>
                    </tr>
                </thead>
                <tbody>
                  
                </tbody>
            </table>
            </div>

JS数据表返回空行

JS datatables returning blank rows

datatable

jquery

datatables