DataTables和Ajax使用错误“未捕获的TypeError：无法读取未定义的属性'length'”

Question

我正在尝试使用dataTable填充表，但是出现以下错误。

"jquery.dataTables.min.js:49 Uncaught TypeError: Cannot read property 'length' of undefined"

我已经阅读了许多有关此主题的帖子，但看不到哪里出了错

桌子

<table name="timeline" border="0" cellpadding="0" cellspacing="0" class="table table-striped" 
    id="wayfinderSignageTable" style="width:100%" data-role="datatable" data-info="false">
  <thead>
  <tr class="CenterHeader">
    <th>Wayfinder</th>
    <th>Promotion</th>
    <th>From</th>
    <th>To</th>
    <th>RecordID</th>
  </tr>
  </thead>
  <tbody>
  </tbody>
</table>

Ajax调用

$(document).on("click", "#current_signage_data_modal", function() { 
  $('#open_current_signage_data_modal').modal('show');

  $('#wayfinderSignageTable').DataTable({
    ordering: false,
    paging: false,
    searching: false,
    bInfo : false,
    responsive: true,
    fixedHeader: true,
    ajax: 'get_wayfinder_signage.php', 
    type: 'POST',
    columns: [
      { data: 'DisplayName', width: 50 },
      { data: 'Promotion', width: 50 },
      { data: 'RoomFromDate', width: 50 },
      { data: 'RoomToDate',  width: 50},
      { data: 'RecordID',  width: 50}
    ],
  });

});

返回的JSON

[{"RecordID":"104","DisplayName":"Main reception","Promotion":"EXBHX Test 1","RoomFromDate":"20-09-2019","RoomToDate":"30-09-2019"},
{"RecordID":"105","DisplayName":"Main reception","Promotion":"EXBHX Test3","RoomFromDate":"20-09-2019","RoomToDate":"30-09-2019"},
{"RecordID":"106","DisplayName":"Conference centre","Promotion":"EXBHX Test 4","RoomFromDate":"20-09-2019","RoomToDate":"30-09-2019"},
{"RecordID":"107","DisplayName":"Conference centre","Promotion":"EXBHX Test 4","RoomFromDate":"20-09-2019","RoomToDate":"30-09-2019"}]

在此先感谢您的帮助和时间。

Answer 1

原因

错误无法使用jQuery DataTables获取未定义或null引用（IE）的属性“ length”，或无法读取jQuery DataTables的未定义属性“ length”（其他浏览器）通常意味着该插件无法访问数据以响应Ajax请求。

解决方案

使用ajax.dataSrc选项并将其设置为空字符串，如下所示，以匹配您的JSON响应。

$('#wayfinderSignageTable').DataTable({
   ajax: {
      url: 'get_wayfinder_signage.php', 
      dataSrc: ''
   },
   // .. skipped
});

链接

jQuery DataTables: Common JavaScript console errors - TypeError: Cannot read property 'length' of undefined