我想使用jQuery DataTables插件将我的一个MongoDb集合显示在表中。
但是,我收到了如下所示的弹出消息:
请求row0,第0列的未知参数'0'。更多 有关此错误的信息,请参阅http://datatables.net/tn/4
以下部分代码以MongoDb程序方式从job id
中选择title
,submitted
,status
和jobs collection
列:
submit.php
$filter = ['user_id' => $_SESSION['google_id']];
$query = new MongoDB\Driver\Query($filter);
try {
$cursor = $manager->executeQuery($dbname.'.'.$collection, $query);
$arr = array();
foreach($cursor as $c){
$temp = array("job_id" => $c->job_id, "title" => $c->title, "submitted" => $c->submitted, "status" => $c->status);
array_push($arr, $temp);
}
echo json_encode($arr);
} catch (MongoDB\Driver\Exception\Exception $e) {
echo $e->getMessage(), "\n";
}
并在HTML页面中显示:
jobs.php
<table id="tableJobs"></table>
<script>
$(document).ready(function(){
$.ajax({
type: "POST",
url: "submit.php",
data: "",
dataType: "json",
success: function(resultData) {
var opt={
"bProcessing":true,
"aoColumns":
[
{"sTitle":"Submission"},
{"sTitle":"Title"},
{"sTitle":"Submitted On"},
{"sTitle":"Status"}
],
"aaData": resultData
};
$("#tableJobs").dataTable(opt);
}
});
});
</script>
我错过了哪些步骤?如何让它在HTML表格中显示db中的所有JSON数据源,如下所示:
<tr>
<td>F37CE14A-506C-24E7-EBDC-362216BB9089</td>
<td>Demo</td>
<td>2017-03-01 06:47:03</td>
<td>Finished</td>
</tr>
感谢您的帮助。
答案 0 :(得分:1)
嗯,这正是问题(至少是数据表文档所说的)。您行中的某个位置似乎有空值或空值。尝试初始化将它们初始化为空字符串。
$job_id = !empty($c->job_id) ? $c->job_id : '';
$title = !empty($c->title) ? $c->title : '';
$submitted = !empty($c->submitted) ? $c->submitted : '';
$status = !empty($c->status) ? $c->status : '';
$temp = array("job_id" => $job_id, "title" => $title, "submitted" => $submitted, "status" => $status);
此外,您需要告诉浏览器预期的内容,即JSON。因此,在输出数据之前添加标题函数:
header('Content-Type: application/json'); // add this line here
echo json_encode($arr);
<强>更新强>
因此,查看数据表的文档,您需要使用“aoColumns”对象上的属性“mDataProp”设置列标识符。然后将这些声明的键设置为结果中的数组键。请参阅下面的小提琴:
$(document).ready(function(){
var resultData = [
{"Submission":"BB520E08-A183-CBEB-BAE2-006056169116","Title":"LA001","Submitted On":"2017-03-12 11:27:41","Status":"Running"},
];
var opt={
"bProcessing":true,
"aoColumns":
[
{"mDataProp":"Submission"},
{"mDataProp":"Title"},
{"mDataProp":"Submitted On"},
{"mDataProp":"Status"}
],
"aaData": resultData
};
$("#tableJobs").dataTable(opt);
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://cdn.datatables.net/1.10.13/js/jquery.dataTables.min.js"></script>
<link type="text/css" rel="stylesheet" href="https://cdn.datatables.net/1.10.13/css/jquery.dataTables.min.css">
<table id="tableJobs"></table>
更正此代码段:
$temp = array("job_id" => $job_id, "title" => $title, "submitted" => $submitted, "status" => $status);
对此:
$temp = array("Submission" => $job_id, "Title" => $title, "Submitted On" => $submitted, "Status" => $status);
在回复任何内容之前,您仍然需要此行:
header('Content-Type: application/json'); // add this line here
echo json_encode($arr);