在 JS 脚本中推送 PHP 数组

Posted 2023-05-08

【中文标题】在 JS 脚本中推送 PHP 数组

【英文标题】：Pushing PHP Array in a JS Script

【发布时间】：2021-12-04 23:40:55

【问题描述】：

这是我的第一篇文章，如果不是那么好，请向我道歉。

这是我的“area_chart.charts.php”数组所在的位置：

$data=array();
foreach ($result as $row) 
  $chartDate = date("d/m", strtotime($row['created_at']));
  $chartResultats = $row['traitements'];
  $chart = array("chartResultats" => $chartResultats,"chartDate" => $chartDate);
  array_push($data, $chart);

JSON 响应：https://prnt.sc/1whxygm

我正在尝试使用 Ajax 检索数据以将其与 Chart.JS 一起使用，但我这样做的方式不起作用。有人知道怎么做吗？

我想要的结果是：

chartResultats: [10, 30, 20]
chartDate: ["16/10", "16/10", "16/10"]

我尝试像这样使用 Ajax：

$.ajax(
url:"./inc/charts/area_chart.charts.php",
method:"GET",
success:function(data)  
console.log(data);
chartResultats = data["chartResultats"];
chartDate = data["chartDate"];

// Area Chart

var ctx = document.getElementById("chartResultats");
var myLineChart = new Chart(ctx, 
  type: 'line',
  data: 
    labels: [chartDate],
    datasets: [
      data: [chartResulats],
    ],

和 Fetch 但它没有成功。我的图表显示欠佳。

你能帮我或澄清一下吗？ 提前致谢！

【问题讨论】：

请分享更多细节。 究竟是什么不适用于给定的代码？你有什么努力让它发挥作用？

【参考方案1】：

您没有说明如何输出 $data 数组以使其可用于 AJAX。

要将$data 输出为 JSON，您必须以 结束脚本，

header('Content-Type: application/json;charset=UTF-8');
print json_encode($data);
exit();

然后您可以使用浏览器打开charts.php 页面并检查JSON 输出。

但是，要获得所需的 JSON，您需要类似的东西，

$data=array(
    'chartResultats' => array(),
    'chartDate' => array(),
);

foreach ($result as $row) 
  $data['chartDate'][] = date("d/m", strtotime($row['created_at']));
  $data['chartResultats'][] = $row['traitements'];


header('Content-Type: application/json;charset=UTF-8');
print json_encode($data);
exit();

输出应该是这样的，

    "chartResultats": [10, 30, 20],
    "chartDate": ["16/10", "16/10", "16/10"]

在您发布的代码中，您在每次迭代时创建一个新字典，其中包含一个 chartResultats r 和一个 chartDate d（我们称之为 r: 1, d: 1 ）：

$chart = array("chartResultats" => $chartResultats,"chartDate" => $chartDate);

然后你将这个对象推送到数据上，得到一个这样的对象数组：

array_push($data, $chart);

所以您的数据是 [ r: 1, d: 1 , r: 2, d: 2 , ... ]（字典数组）而不是 r: [ 1, 2, ... ], d: [ 1, 2, ... ] （两个数组的字典）。

注意。

我认为这样，您已经正确格式化了两个数组；没有必要在成功回调中再次格式化它们。所以，试试

data: 
   labels: data["chartDate"],    // Not [chartDate]
   datasets: [
      data: data["chartResultats"],  // Not chartResultats
   ],

【讨论】：

我已经这样做了，我只是没有上传所有文件，但它已经是 JSON 类型，因为它给了我响应。您可以在屏幕截图中看到它！ :)

抱歉：在“我需要的 JSON”中，您没有包含大括号或引号；在您生成和发布的 JSON 中，代码以错误的方式推送数据，作为数组中的对象。您需要添加到字典中的条目（请参阅此答案的第二部分）。

感谢您的回答。它现在不再显示未定义。它向我显示日期，但不是它必须的方式，并且“结果”也不会显示。截图：prnt.sc/1wivl38

@newcomerindev 嗯，我认为您可能过度使用了下标。添加注释。

【参考方案2】：

或者你可以使用回声

echo json_encode($data);

【参考方案3】：

LSerni 的回答可能会导致解决问题，因为它解决了我认为为解决问题chart is returning undefined 的前提中缺少的最重要的东西。

除此之外，我看到当您收到响应时，在您的 $.AJAX.success 函数中您只执行了一个可能会失败的分配，因为 data.chartResultats 和 data.chartDate 未定义。相反，data 是一个包含 chartResultats 和 chartDate 的对象数组。

chartResultats = data["chartResultats"];
chartDate = data["chartDate"];

因此，一种产生预期输出的解决方案（

chartResultats: [10, 30, 20]
chartDate: ["16/10", "16/10", "16/10"]

) 是迭代数据。这是一种实现：

var chartResultats = [];
var chartDate = [];
data.forEach(function(record)
  chartResultats.push(record.chartResultats);
  chartDate.push(record.chartDate);
);

【讨论】：

感谢您的回答。所以我按照你说的做了，现在它什么都没有显示。 ://

您解决了这个问题吗？什么不显示？你检查chartResultats 和chartDate 的内容了吗？如果您还为您的 PHP 代码实现了 LSerni 的解决方案来打印 JSON，那么我所说的就没有必要了。