数据表：未捕获的类型错误：无法读取未定义的属性“长度”

Posted 2023-05-07

【中文标题】数据表：未捕获的类型错误：无法读取未定义的属性“长度”

【英文标题】：Datatables: Uncaught TypeError: Cannot read property 'length' of undefined

【发布时间】：2012-12-13 00:10:49

【问题描述】：

我正在尝试将 ajax 源与 Datatables 一起使用，但在执行过程中遇到了一些错误。以前 Ajax 没有与 Datatables 一起使用，它们工作正常，但在尝试使用 Ajax 和 JSON 时出现了一些错误。

我收到的错误如下：

未捕获的类型错误：无法读取未定义的属性“长度”

编辑：直接在此文本下方使用修改后的代码后，此错误不再存在，但 DataTables 仍然损坏（没有搜索、分页、排序等...）。有一个活生生的例子可能会有所帮助，所以试试这个网站：fogest.com/test

这里是页面加载时创建表格的代码：

$(document).ready(function() 
    $('#trades').dataTable( 
        "sDom": "<'row'<'span6'l><'span6'f>r>t<'row'<'span6'i><'span6'p>>",
        "sPaginationType": "bootstrap",
        "bProcessing": true,
        "bServerSide": true,
        "aoColumns": [
             "mData": "id" ,
             "mData": "Minecraft_Username" ,
             "mData": "Block_Name" ,
             "mData": "Quantity" ,
             "mData": "Cost" ,
             "mData": "Trade_Status" ,
          ],
        "sAjaxSource": "test.php"
     );
 );

而 sAjaxSource test.php 包含以下内容：

<?php 
$tableName = "mctrade_trades";
$result = mysql_query("SELECT `id`, `Minecraft_Username`, `Block_Name`, `Quantity`, `Cost`, `Trade_Status` FROM $tableName");

$data = array();
while ( $row = mysql_fetch_assoc($result) )

    $data[] = $row;

header("Content-type: application/json");
echo json_encode( $data );    

?>

test.php 的输出：

["id":"1","Minecraft_Username":"fog","Block_Name":"DIAMOND_PICKAXE","Quantity":"1","Cost":"100","Trade_Status":"1","id":"2","Minecraft_Username":"fog","Block_Name":"DIAMOND_PICKAXE","Quantity":"1","Cost":"1002","Trade_Status":"1","id":"3","Minecraft_Username":"fog","Block_Name":"DIAMOND_PICKAXE","Quantity":"1","Cost":"1035","Trade_Status":"1","id":"4","Minecraft_Username":"fog","Block_Name":"DIAMOND_PICKAXE","Quantity":"1","Cost":"1035","Trade_Status":"1","id":"5","Minecraft_Username":"fog","Block_Name":"DIAMOND_PICKAXE","Quantity":"1","Cost":"100","Trade_Status":"2","id":"6","Minecraft_Username":"fog","Block_Name":"DIAMOND_PICKAXE","Quantity":"1","Cost":"100","Trade_Status":"2","id":"7","Minecraft_Username":"fog","Block_Name":"DIAMOND_PICKAXE","Quantity":"1","Cost":"10000","Trade_Status":"2"]

表格已正确生成，但由于此错误，有文字说“表格正上方正在处理，您无法使用数据表的任何功能，例如搜索。

这是使用上述 JSON 的表格的图像：

我假设错误出现在我的 JSON 输出中，但我不完全知道它有什么问题，也不知道我应该做什么来修复它。我是 Web 开发的新手，实现 Datatables 的学习曲线相当不错！

【问题讨论】：

如果删除数据表配置中的"sAjaxDataProp": "", 行会怎样？你仍然遇到同样的错误吗？

@TanzeelKazi 删除该行时似乎没有任何反应。我已经更新了我的帖子以显示我正在使用的新 JS，但现在不是任何错误，而是现在 DataTable 功能似乎不起作用。分页消失了，搜索、排序等现在都不起作用了，只是没有错误来解释为什么了。如果它有帮助，这里是我的站点链接，您可以在其中查看测试：fogest.com/test/index.php

【参考方案1】：

您的 JSON 输出错误，原因如下：

iTotalRecords 和 iTotalDisplayRecords 字段丢失。这就是分页（和所有其他功能）被破坏的原因（注意消息“显示 1 到 NaN of NaN 条目（从 NaN 总条目）”在页脚部分）。有关服务器端处理的更多详细信息，请参阅this page。 在 JSON 响应之后有一些 html 代码。

这是额外的 HTML 代码（取自test.php）：

<!-- Hosting24 Analytics Code -->
<script src="http://stats.hosting24.com/count.php"></script>
<!-- End Of Analytics Code -->

在我看来，test.php 脚本应该如下所示：

<?php 

$link = mysqli_init();

// Adjust hostname, username, password and database name before use!
$db = mysqli_real_connect($link, "hostname", "username", "password", "database") or die(mysqli_connect_error());

$SQL = 'SELECT `id`,`Minecraft_Username`,`Block_Name`,`Quantity`,`Cost`,`Trade_Status` FROM mctrade_trades';
$result = mysqli_query($link, $SQL) or die(mysqli_error($link));

$aaData = array();
while ($row = mysqli_fetch_assoc($result)) 
    $aaData[] = $row;


$response = array(
  'aaData' => $aaData,
  'iTotalRecords' => count($aaData),
  'iTotalDisplayRecords' => count($aaData)
);
if (isset($_REQUEST['sEcho'])) 
  $response['sEcho'] = $_REQUEST['sEcho'];


header('Content-type: application/json'); 
echo json_encode($response);

?>

还要注意mysql_* 函数已被弃用，因此您应该改用PDO 或MySQLi；更多详情请查看this answer。

【讨论】：

正在添加的附加内容的问题是我的主机（免费）自动插入，所以我别无选择。我想我需要更换主机，但与此同时，我会在本地进行测试。我会试试你的答案，并在另一条评论中回复你我的结果！谢谢！

在尝试了您提供的代码后，我遇到了与以前基本相同的问题，只是条目不再显示NaN，它们显示了正确的条目数。搜索和过滤（排序）仍然被破坏。当我尝试使用它们时，会出现一个“处理”文本，但没有任何变化。 编辑：这是在本地主机上完成的。本地主机上不存在 JSON 之后的额外 html

我的 PHP 代码只是一个例子。你可以找到更好的服务器端 PHP 脚本here。