datatables php数据,关于javascript：使用PHP数组作为DataTables的数据源

我是jQuery的新手，正在尝试将jQuery数组用作jQuery DataTable的数据源。 该数组的设置完全符合我的需要，我已经通过使用echo json_encode($ data);进行了验证。

这是我正在使用的jQuery代码。

var information = <?php echo json_encode($data) ?>;

alert(information.toString());

$(document).ready(function () {

$('#my-table').dataTable({

data: information,

columns: [

{ title: 'Salesman' },

{ title: 'Office' },

{ title: 'Title' },

{ title: 'Salary' }

]

});

});

不要在对象数组上使用alert()。 使用console.log()并在浏览器开发工具控制台中检查结果。 列定义还需要一个data属性以匹配对象中的属性。 根据您在警报中看到的内容，似乎没有任何错误将数据从php传递到javascript

将php数组传递给jquery函数的可能重复项

@charlietfl-仅仅是console.log(信息)

是的...然后打开控制台(F12)

@charlietfl-这给我一个Uncaught Error: DataTables warning: table id=my-table - Requested unknown parameter 0 for row 0, column 0.错误

需要查看对象在数组中的外观...只是一个示例

@charlietfl-如何显示jQuery数组？

console.log(JSON.stringify(information[0]))

这给了我我期望的[{"Salesman":"Harris Teeter","Title":"Consulting JavaScript Architect","Office":"Home","Salary":"500000.00"}]

好的，因此在{ title: Salesman , data:Salesman}列中应该可用。 data用于行单元格

如果我跟着你说我需要从数组中删除值？

不...您需要告诉插件哪个对象属性属于哪个列

一个示例，您在PHP中具有一个变量数组：

$information = array(

array("Salesman1" =>"Harris 1","Title"=>"Consulting JavaScript Architect","Office"=>"Home","Salary"=>"500000.00"),

array("Salesman2" =>"Harris 2","Title"=>"Consulting JavaScript Architect","Office"=>"Home","Salary"=>"500000.00"),

array("Salesman3" =>"Harris 3","Title"=>"Consulting JavaScript Architect","Office"=>"Home","Salary"=>"500000.00"),

array("Salesman4" =>"Harris 4","Title"=>"Consulting JavaScript Architect","Office"=>"Home","Salary"=>"500000.00"),

array("Salesman5" =>"Harris 5","Title"=>"Consulting JavaScript Architect","Office"=>"Home","Salary"=>"500000.00")

);

?>

我们想使用json_encode函数将其输出为JSON格式：

echo json_encode($information);

?>

将产生这个：

[{"Salesman":"Harris 1","Title":"Consulting JavaScript

Architect","Office":"Home","Salary":"500000.00"},{"Salesman":"Harris

2","Title":"Consulting JavaScript

Architect","Office":"Home","Salary":"500000.00"},{"Salesman":"Harris

3","Title":"Consulting JavaScript

Architect","Office":"Home","Salary":"500000.00"},{"Salesman":"Harris

4","Title":"Consulting JavaScript

Architect","Office":"Home","Salary":"500000.00"},{"Salesman":"Harris

5","Title":"Consulting JavaScript

Architect","Office":"Home","Salary":"500000.00"},{"Salesman":"Harris

6","Title":"Consulting JavaScript

Architect","Office":"Home","Salary":"500000.00"}]

现在，当您将此结果嵌入javascript变量中时：

var information = <?php echo json_encode($data) ?>;

在客户端浏览器中，它将生成如下：

var information = [{"Salesman":"Harris 1","Title":"Consulting JavaScript Architect","Office":"Home","Salary":"500000.00"},{"Salesman":"Harris 2","Title":"Consulting JavaScript Architect","Office":"Home","Salary":"500000.00"},{"Salesman":"Harris 3","Title":"Consulting JavaScript Architect","Office":"Home","Salary":"500000.00"},{"Salesman":"Harris 4","Title":"Consulting JavaScript Architect","Office":"Home","Salary":"500000.00"},{"Salesman":"Harris 5","Title":"Consulting JavaScript Architect","Office":"Home","Salary":"500000.00"},{"Salesman":"Harris 6","Title":"Consulting JavaScript Architect","Office":"Home","Salary":"500000.00"}]

以上结果是您的javascript数据源。我们将其与Datatables Data选项一起使用。 Datatables Javascript Sourced Data中的一些示例。可以是数组或对象。

当您的PHP数组获得特定的键索引名称时，它将转换为JSON对象中的相同键。因此，在数据表中，此对象键需要包含在columns.data选项内。您也可以使用Datatables colums.title来设置列名。

$(document).ready(function () {

$('#my-table').dataTable({

data: information,

columns: [

{ data: 'Salesman', title: 'Salesman' },

{ data: 'Office', title: 'Office' },

{ data: 'Title', title: 'Title' },

{ data: 'Salary', title: 'Salary' }

]

});

});

查看并运行下面的演示代码段：

var information = [

{"Salesman":"Harris Teeter","Title":"Consulting JavaScript Architect","Office":"Home","Salary":"500000.00"},

{"Salesman":"Adam Smith","Title":"Consulting JavaScript Architect","Office":"Home","Salary":"500000.00"},

{"Salesman":"Mirole","Title":"Consulting JavaScript Architect","Office":"Home","Salary":"500000.00"},

{"Salesman":"Jave Mocha","Title":"Consulting JavaScript Architect","Office":"Home","Salary":"500000.00"},

{"Salesman":"Airis","Title":"Consulting JavaScript Architect","Office":"Home","Salary":"500000.00"},

{"Salesman":"Steve Mat","Title":"Consulting JavaScript Architect","Office":"Home","Salary":"500000.00"},

];

$(document).ready(function () {

$('#my-table').dataTable({

data: information,

columns: [

{ data: 'Salesman', title: 'Salesman' },

{ data: 'Office', title: 'Office' },

{ data: 'Title', title: 'Title' },

{ data: 'Salary', title: 'Salary' }

]

});

});

SalesmanTitleOfficeSalary

SalesmanTitleOfficeSalary

你有没有尝试过：

var information = JSON.parse('<?php echo json_encode($data) ?>');

console.log(information);

$(document).ready(function () {

$('#my-table').dataTable({

data: information,

columns: [

{ title: 'Salesman' },

{ title: 'Office' },

{ title: 'Title' },

{ title: 'Salary' }

]

});

});

使用console.log，您将看到数组是否被正确解析，并且根据我的经验，还可以使用JSON.parse将数组从PHP传递到JS是更好的做法，语法错误的风险较小。

为什么您需要这样做？ 无论如何，OP警报显然会显示一系列对象

@charlietfl你说得对，警报显示语法错误不是这里的问题...