使用 MySQL 填充 jQuery DataTable

Posted 2023-02-24

【中文标题】使用 MySQL 填充 jQuery DataTable

【英文标题】：Populate a jQuery DataTable with MySQL

【发布时间】：2014-08-22 17:35:03

【问题描述】：

我试图在不使用 AJAX 的情况下使用 mysql 数据库中的信息填充 jQuery DataTable。我宁愿只使用更简单的代码，因为这个项目的目的是尽可能地小。以下代码在我的 html 标记开始之前：

<?php
    //Connect to the MySQL database
    $usernameMain = "username"; 
    $passwordMain = "password"; 
    $hostMain = "host"; 
    $dbnameMain = "database";
    $optionsMain = array(PDO::MYSQL_ATTR_INIT_COMMAND => 'SET NAMES utf8'); 
    $dbMain = new PDO("mysql:host=$hostMain;dbname=$dbnameMain;charset=utf8", $usernameMain, $passwordMain, $optionsMain);

    $sql = 'SELECT  name,date,location,entity,type FROM `events`';
    $result = $dbMain->query($sql);

?>

我已经生成了一个到我的数据库的连接（我删除了我的详细信息），并且还确保为 jQuery DataTables 导入脚本文件。

在我的 HTML 文档的下方，我创建了一个表格并尝试使用 while 循环来回显此数据库信息：

<table class="table table-hover table-nomargin table-bordered usertable"
    id="datatables">
        <thead>
            <tr class='thefilter'>
                <th class='with-checkbox'></th>
                <th>Name</th>
                <th>Location</th>
                <th>Type</th>
                <th>Date</th>
                <th>Entity</th>
                <th>Options</th>
            </tr>
            <tr>
                <th class='with-checkbox'><input id="check_all" name=
                "check_all" type="checkbox"></th>
                <th>Name</th>
                <th>Location</th>
                <th>Date</th>
                <th>Type</th>
                <th>Sponsoring Entity</th>
                <th>Options</th>
            </tr>
        </thead>

        <tbody>
            <!--Gather Rows from Database-->
            <?php
             $row = mysqli_fetch_array($result);
              while ($row)     
             ?>

            <tr>
                <td class="with-checkbox"><input name="check" type="checkbox"
                value="1"></td>
                <td><?php echo $row['name']; ?></td>
                <td><?php echo $row['date']; ?></td>
                <td><?php echo $row['location']; ?></td>
                <td><?php echo $row['entity']; ?></td>
                <td><?php echo $row['type']; ?></td>
                <td>
                    <a class="btn icon-pencil" href="#" rel="tooltip" style=
                    "font-style: italic" title="Edit"></a> <a class=
                    "btn icon-plus-sign" href="#" rel="tooltip" style=
                    "font-style: italic" title="Enter Attendance"></a>
                </td>
            </tr>
            <?php
             
            ?>
        </tbody>
    </table>

然后在创建此表后，我插入以下 javascript 代码以使用 jQuery 将表初始化为 DataTable：

<script type="text/javascript">
(document).ready(function() 
    $('#datatables').dataTable( 
     );
 );
</script>

我没有适当的声誉来上传图片，所以我创建了一个 Imgur 相册，其中包含我网站的数据库设置以及我在此处的 HTML 页面中遇到的错误：https://imgur.com/a/vacA4

我不确定问题是数据库连接、DataTables 还是其他问题。我在这个问题上花了很多时间，并且不断遇到障碍。任何帮助将不胜感激。

提前感谢您的帮助。

【问题讨论】：

它不起作用的原因是您正在使用 PDO 建立 DB 连接，但使用的是基于 mysqli_ 的函数 mysqli_fetch_array()。这两个 MySQL API 不能混合使用。您应该使用fetch() 或fetchALL() 代替它，或者用基于mysqli_ 的连接替换您的PDO 连接；你有两个选择。

在打开连接后立即将错误报告添加到文件顶部error_reporting(E_ALL); ini_set('display_errors', 1); 和$dbMain->setAttribute(PDO::ATTR_ERRMODE, PDO::ERRMODE_EXCEPTION);。

你能给我一个例子，说明我将如何使用 fetchALL() 为 PDO 创建一个语句吗？我尝试设置 $row = $result->fetchAll(PDO::FETCH_ASSOC);但现在我的页面无法加载。

试试while ($row = $result->fetchAll(PDO::FETCH_ASSOC)) ，你现在有while($row)，同时删除$row = mysqli_fetch_array($result);

该代码不会像以前那样出错，但我的表只有一个空白条目。我不确定为什么它没有检索任何数据。

【参考方案1】：

您可以只使用 dataTable 的 data 选项，并通过 json_encode 提供 php 数据结构

dataTable(
  ...
  data: <?phpecho json_encode($data_prepared_from_db); ?>
)