DataTables - 排序，搜索，分页不起作用
Posted
技术标签:
【中文标题】DataTables - 排序，搜索，分页不起作用【英文标题】：DataTables - sorting, searching, pagination not working 【发布时间】：2021-08-09 09:02:05 【问题描述】：我正在使用 jQuery DataTables 插件。 数据已填充，但分页、搜索和排序不起作用。我的 jQuery 版本是 3.5.1，DataTables 版本是 1.10.24，我有所有 tbody,tr,th,td 标签。 指向 Datatables.js 的链接在 html 中，指向 datatables css 的链接在 head 中。我的表 ID 是 #mytable- 与 DataTables 脚本中的相同。 怎么了？
我的代码： user.php
<!DOCTYPE html>
<html lang="lt">
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.5.2/css/bootstrap.min.css">
<link rel="stylesheet" href="vendor/bootstrap-select/css/bootstrap-select.min.css">
<link rel="stylesheet" type="text/css" href="https://cdn.datatables.net/1.10.24/css/jquery.dataTables.css">
</head>
<body>
<?php
$menu = 3;
require '../layout/nav.php';
?>
<caption><h2 class="text-center">Users</h2></caption>
<?php
require '../db/db.php'; // Connect to the database.
$query="SELECT id,name FROM user";
$result=mysqli_query($dbcon,$query);
if (mysqli_num_rows($result)>0)
echo '
<table id="mytable" class="display table table-striped table-bordered table-sm">
<thead>
<tr>
<th scope="col">ID</th>
<th scope="col">name</th>
</tr></thead>';
while ($row=mysqli_fetch_array($result, MYSQLI_ASSOC))
$id=htmlspecialchars($row['id'],ENT_QUOTES);
$name=htmlspecialchars($row['name'],ENT_QUOTES);
echo '<tbody><tr>
<td>'.$id.'</td>
<td>'.$name.'</td>
</tr></tbody>';
echo '</table>';
?>
<script type="text/javascript" charset="utf8" src="https://cdn.datatables.net/1.10.24/js/jquery.dataTables.js"></script>
<script>
$(document).ready( function ()
$('#mytable').DataTable();
);
</script>
</body>
</html>
【问题讨论】：
【参考方案1】：你应该将 tbody 包裹在循环周围，而不是把它放在里面。
<table>
<thead>
...
</thead>
<tbody>
<tr> <!-- row 1-->
<td>
<td>
</tr>
<tr> <!-- row 2-->
<td>
<td>
</tr>
</tbody>
</table>
【讨论】：
以上是关于DataTables - 排序，搜索，分页不起作用的主要内容，如果未能解决你的问题，请参考以下文章