首页 > 解决方案 > 将 jQuery DataTable 的 DataSource 设置为 PHP JSON 编码数组

问题描述

我正在使用下面的代码来查询 MySql 并将结果返回到一个数组。我已经用 for each 循环验证了我的结果符合预期。

这个过程的最后一步是将此 php 数组设置为 jQuery 数据表的数据源?我有以下代码,但从未创建过我的 DataTable。

我错过了什么?

<table id="example" class="display" width="100%"></table>

<?php
$con=mysqli_connect("site", "user", "psasswr=ord", "db");

if (mysqli_connect_errno())
{
echo "Failed to connect to MySQL: " . mysqli_connect_error();
}

$sql="SELECT * FROM test LIMIT 10";
$result = mysqli_query($con,$sql);

$data = [];

foreach ($result as $row) {
   $data[] = $row;
}

mysqli_free_result($result);

mysqli_close($con);
?>

<script>
var dataSet = <?php echo json_encode($result); ?>;
$(document).ready(function() {
    $('#example').DataTable( {
        data: dataSet,
        columns: [
            { title: "Name" },
            { title: "Title" },
            { title: "Office" },
            { title: "Salary" }
        ]
    } );
} );
</script>

编辑
根据要求,如果我执行以下操作,这就是我的 JSON 的样子echo json_encode($data)

[{"Salesman":"Harris Teeter","Title":"Manager","Office":"Home","Salary":"0.000000"}]

标签: phpjquerydatatables

解决方案


首先,您需要在数据表函数中使用数据而不是标题

$('#example').DataTable( {
    data: dataSet,
    columns: [
        { data: "Name" },
        { data: "Title" },
        { data: "Office" },
        { data: "Salary" }
    ]
} );

其次,您需要修改您的 JSON,如下所示:

[{"Name":"Harris Teeter","Title":"Manager","Office":"Home","Salary":"0.000000"}]

这是工作的 JSFiddle:链接


推荐阅读