DataTables 警告：非表节点初始化 (DIV)。有关此错误的更多信息，请参阅 http://datatables.net/tn/2答案

【问题标题】：DataTables warning: Non-table node initialisation (DIV). For more information about this error, please see http://datatables.net/tn/2DataTables 警告：非表节点初始化 (DIV)。有关此错误的更多信息，请参阅 http://datatables.net/tn/2
【发布时间】：2020-02-29 01:51:55
【问题描述】：

我创建了一个表格来回显表格数据，我需要设计带有排序、搜索和分页功能的表格，但是错误显示像这样DataTables warning: Non-table node initialisation (DIV). For more information about this error, please see http://datatables.net/tn/2，下面是我的编码：

head

<link href="http://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css" rel="stylesheet">   
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
<link rel="stylesheet" href="http://cdn.datatables.net/1.10.2/css/jquery.dataTables.min.css"></style>
<script type="text/javascript" src="http://cdn.datatables.net/1.10.2/js/jquery.dataTables.min.js"></script>
<script type="text/javascript" src="http://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/js/bootstrap.min.js"></script>

Echo Table coding

<?php
session_start();
$qry = "select id, name, identify, created, pay_option, amount, receivedby from payment_details";
$_SESSION["query"] = $qry;
$result = $conn->query("select id, name, identify, created, pay_option, amount, receivedby from payment_details");
$rows = $result->fetchAll(PDO::FETCH_ASSOC);
echo "<div id='myTable'><div class='data-content'><span><b>REPORT SELECTION</b></span><div class='data-table'>";
echo "<table id='dataTable'><tr><th>Payer</th><th>Passport/IC No</th><th>Date Paid</th><th>Payment Type</th><th>Payment Amount</th><th>Received by</th><th>Payment Receipt</th></tr>";
foreach($rows as $row) {
echo "<tr id=".$row["id"]."><td>".$row["name"]."</td><td>".$row["identify"]."</td><td>".$row["created"]."</td><td>".$row["pay_option"]."</td><td>".$row["amount"]."</td><td>".$row["receivedby"]."</td><td><a href='?loc=invoice' onclick='sessionFunction(".$row["id"].")'>View</a></td></tr>";
                }
echo "</table>";
echo "</div></div><div class='table-msg'><span>Total Record : ";
echo $result->rowCount();
echo "</span><span style='margin-left: 70%;'>Max 500 pages</span></div></div>";
                ?>

Script Function

$(document).ready(function(){
$('#myTable').dataTable();
});

我的输出这样显示我

实际我想要如下示例的输出表，图片中的红色箭头表示我想要该功能：

我希望有人编码专家可以指导我如何解决它，这个问题已经让我在几天内陷入困境。谢谢。

【问题讨论】：

标签： php datatables

【解决方案1】：

在您的 HTML 中，您已经定义了这两个标签：

<div id='myTable'>

和：

<table id='dataTable'>

所以，你的表格标签的 ID 是dataTable。

但是当你初始化 DataTables 时...

$(document).ready(function(){
  $('#myTable').dataTable();
});

...您使用的 ID 是 myTable - 这是 <div> 标记的 ID。您需要使用<table> 标签的ID。

我建议在您的 HTML 中交换 ID，如下所示：

<div id="dataTable">

和：

<table id="myTable">

（通常使用双引号，而不是单引号。）

但这解释了错误消息：

DataTables 警告：非表节点初始化

您正在尝试使用 <div> 来初始化 DataTables。通过进行此更改，您应该能够克服此错误。

（当然，这个错误背后可能隐藏着其他问题。）

我还注意到示例（例如here）指的是函数DataTable() 而不是dataTable()。我建议完全遵循他们的语法（我假设您使用的是 1.10.20 版本）。

【讨论】：