使用 Ajax 和 PHP 进行简单的 DataTable 初始化答案

【问题标题】：Simple DataTable initialization with Ajax and PHP使用 Ajax 和 PHP 进行简单的 DataTable 初始化
【发布时间】：2013-12-24 17:40:30
【问题描述】：

我只是在使用 Ajax 和 PHP 初始化 DataTable 时遇到了一些麻烦。根据检查员的错误是：

Uncaught TypeError: Cannot read property 'length' of undefined jquery.dataTables.js:2649
(anonymous function) jquery.dataTables.js:2649
oSettings.jqXHR.$.ajax.success jquery.dataTables.js:8749
c jquery.js:3048
p.fireWith jquery.js:3160
k jquery.js:8235
r jquery.js:8778

我已按照数据表网站上的说明进行操作，但显然我做错了。这不是php部分，我刚刚检查过，它正在返回一个json文件。

这就是我所拥有的。

提前致谢。

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Chromo Insiders</title>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<script src="DataTables/media/js/jquery.dataTables.js"></script>
<script type="application/javascript" language="javascript" src="insiders.js"></script>
<link rel="stylesheet" type="text/css" href="ci_style.css" />
<style type="text/css">
    @import 'DataTables/media/css/demo_table_jui.css';
</style>
</head>

<body>

<header>
    <h1>Chromo Insiders</h1>
</header>

<table id="datatables">
    <thead>
        <tr>
            <th>email</th>
            <th>Last Name</th>
            <th>First Name</th>
            <th>Date Registered</th>
        </tr>
    </thead>
    <tbody>
    </tbody>
</table>
</body>
</html>

这是脚本：

$(document).ready(function(e) {


$('#datatables').dataTable( {
        "bProcessing": true,
        "sAjaxSource": 'process.php'
    } );

});

以防万一您需要查看 php 代码：

<?php

        try {
            $conn = require_once 'dbConnect.php';

            $sql = "SELECT email, lastName, firstName, state, dateRegistered FROM Users";

            $result = $conn->prepare($sql) or die ($sql);

            if(!$result->execute()) return false;

            if($result->rowCount() > 0) {
                $json = array();
                while($row = $result->fetch()){
                    $json[] = array(
                        'email' => $row['email'],
                        'lastName' => $row['lastName'],
                        'firstName' => $row['firstName'],
                        'dateRegistered' => $row['dateRegistered'],
                        'state' => $row['state']
                    );
                }

                $json['success'] = true;
                echo json_encode($json);
            }
        } catch(PDOException $e) {
            echo 'Error: ' . $e->getMessage();
        }
?>

【问题讨论】：

你确定它没有返回 false 吗？
@FrankConry 从浏览器我调用了 php 文件，它向我展示了 json 文档，不确定，但我认为它正在返回 true，对吗？

标签： php jquery ajax datatable

【解决方案1】：

您需要这样更改您的回复：

        if($result->rowCount() > 0) {
            $json = array();
            while($row = $result->fetch()){
                /**  MAKE ARRAY NON ASSOCIATIVE **/
                $json[] = array(
                    $row['email'],
                    $row['lastName'],
                    $row['firstName'],
                    $row['dateRegistered'],
                    $row['state']
                );
            }
            /*** MAKE RESPONSE HAVE 'aaData' ENTRY ****/
            $response = array();
            $response['success'] = true;
            $response['aaData'] = $json;
            echo json_encode($response);

参考这里：http://datatables.net/release-datatables/examples/data_sources/ajax.html。具体来说：

DataTables 需要一个包含名为“aaData”的数组的对象，其中数据源。

您的表格也没有“状态”列，尽管您的 ajax 响应确实...

【讨论】：

我按照您所说的进行了更改，它向我展示了：DataTables 警告（表 id='datatables'）：从第 0 行的数据源请求未知参数“0”。奇怪的部分是该表说它有 58 条记录，这意味着它正在填充但记录不存在。另外，“状态”列是什么意思？那是做什么用的？谢谢
啊，可能不要让它成为一个关联数组。像这样：$json[] = array($row['email'], $row['lastName'], $row['firstName'], $row['dateRegistered'], $row['state'] );