通过AJAX和PHP MYSQL将JSON转换为JavaScript变量=>；数组未定义
我试图通过php->json->ajax将mysql数据获取到我的Chartjs的JS变量中。 php生成的JSON看起来非常好。不幸的是，当试图获取我的变量中的数据时，控制台返回未定义的数据 这是我的密码：通过AJAX和PHP MYSQL将JSON转换为JavaScript变量=>；数组未定义,javascript,php,mysql,json,ajax,Javascript,Php,Mysql,Json,Ajax,我试图通过php->json->ajax将mysql数据获取到我的Chartjs的JS变量中。 php生成的JSON看起来非常好。不幸的是，当试图获取我的变量中的数据时，控制台返回未定义的数据 这是我的密码： <?php $con=mysqli_connect("---"); // Check connection if (mysqli_connect_errno()) { echo "Failed to connect to MySQL: " . mysqli_connect_erro
<?php
$con=mysqli_connect("---");
// Check connection
if (mysqli_connect_errno())
{
echo "Failed to connect to MySQL: " . mysqli_connect_error();
}
$result = mysqli_query($con,"SELECT clanarina, vakufnama, zekjat, year from payments where uid = 1");
$data = array();
foreach ($result as $row) {
$data[] = $row;
}
$result->close();
mysqli_close($con);
print json_encode($data);
?>
[{"clanarina":"240","vakufnama":"12500","zekjat":"0","year":"2019"},{"clanarina":"240","vakufnama":"0","zekjat":"0","year":"2021"},{"clanarina":"240","vakufnama":"0","zekjat":"0","year":"2022"},{"clanarina":"240","vakufnama":"0","zekjat":"0","year":"2023"},{"clanarina":"240","vakufnama":"0","zekjat":"0","year":"2024"},{"clanarina":"240","vakufnama":"0","zekjat":"0","year":"2025"}] chart-bar-demo.js:10:15
Array(385) [ undefined, undefined, undefined, undefined, undefined, undefined, undefined, undefined, undefined, undefined, … ]
chart-bar-demo.js:22:15
Array(385) [ undefined, undefined, undefined, undefined, undefined, undefined, undefined, undefined, undefined, undefined, … ]
chart-bar-demo.js:23:15
Array(385) [ undefined, undefined, undefined, undefined, undefined, undefined, undefined, undefined, undefined, undefined, … ]
chart-bar-demo.js:24:15
谢谢你的帮助 PHP返回的JSON在插入数组时仍然是一个字符串。您会注意到数组长度对应于字符串的长度
在循环之前，需要将JSON字符串解析为JS数组，这可以使用
JSON.parse（）实现我使用$.parseJSON（数据）进行了尝试。现在我得到数组（6）[未定义，未定义，未定义，未定义，未定义，未定义]控制台日志：0:Object{clanarina:“240”，vakufnama:“12500”，zekjat:“0”，…}1:Object{clanarina:“0”，vakufnama:“0”，zekjat:“0”，…}2：对象{clanarina:“240”，vakufnama:“0”，zekjat:“0”，…}3：对象{clanarina:“240”，vakufnama:“0”，zekjat:“0”，…}4：对象{clanarina:“240”，vakufnama:“0”，zekjat:“0”，…}5：对象{clanarina:“240”，vakufnama:“0”，zekjat:“0”，…}6:Object{clanarina:“240”，vakufnama:“0”，zekjat:“0”，…}如果您使用的是jQuery 3.0+，他们现在建议使用本机的JSON.parse（）
see。另外，我无法使用您上面发布的代码来重现这一点，$.parseJSON
和JSON.parse（）
给我一个长度为6的对象数组，我可以从中循环得到您想要的值。我从json.parse中得到的数组似乎很好，但循环时得到3个长度正确的数组，但内容未定义。我的循环有什么问题吗？只是确认一下-你有var array=JSON.parse（data）
，你是这样循环的<代码>var clanarinajs=[]；vakufnamajs=[]；var zekjatjs=[]for（数组中的变量i）{clanarinajs.push（数组[i].clanarina）；vakufnamajs.push（数组[i].vakufnama）；zekjatjs.push（数组[i].zekjat）；}）是这样做的：var datanew=JSON.parse（data）；console.log（datanew）；var clanarinajs=[]；vakufnamajs=[]；var zekjatjs=[]；对于（datanew中的var i）{clanarinajs.push（data[i].clanarina）；vakufnamajs.push（data[i].vakufnama）；zekjatjs.push（data[i].zekjat）；}clanarinajs
包含6个元素（从0到5），但您在2019年到2025年的chartdata
中定义了7个标签，即图表预期clanarinajs[6]
也是，这是未定义的。其他…js
变量也一样，这些变量用作chartdata中数据
参数的值。尝试删除2025，并让我们知道结果。在任何情况下，都必须对数据
响应进行JSON解析。
$(document).ready(function(){
$.ajax({
url : "../../getchartdata_payments_user.php",
type : "GET",
success : function(data){
console.log(data);
var clanarinajs = [];
var vakufnamajs = [];
var zekjatjs = [];
for(var i in data) {
clanarinajs.push(data[i].clanarina);
vakufnamajs.push(data[i].vakufnama);
zekjatjs.push(data[i].zekjat);
}
console.log(clanarinajs);
console.log(vakufnamajs);
console.log(zekjatjs);
var chartdata = {
labels: ["2019", "2020", "2021", "2022", "2023", "2024","2025"],
datasets: [
{
label: "Clanarina",
backgroundColor: "#4e73df",
hoverBackgroundColor: "#2e59d9",
borderColor: "#4e73df",
data: clanarinajs
},
{
label: "Vakufnama",
backgroundColor: "#aafac8",
hoverBackgroundColor: "#2e59d9",
borderColor: "#4e73df",
data: vakufnamajs
},
{
label: "Zekjat",
data: zekjatjs
},
{
label: "Goal",
data: [54000, 54000, 55620, 57289, 59007, 60777, 62601],
type: "line",
fill: "false",
backgroundColor: "yellow",
borderColor: "yellow",
}
]
};
var ctx = document.getElementById("myBarChart");
var mybarchart = new Chart(ctx, {
type: 'bar',
data: chartdata,
options: {
maintainAspectRatio: false,
layout: {
padding: {
left: 10,
right: 25,
top: 25,
bottom: 0
}
},
scales: {
xAxes: [{
time: {
unit: 'year'
},
gridLines: {
display: false,
drawBorder: false
},
maxBarThickness: 25,
}],
yAxes: [{
ticks: {
min: 0,
max: 70000,
maxTicksLimit: 5,
padding: 10,
// Include a dollar sign in the ticks
callback: function(value, index, values) {
return 'KM' + number_format(value);
}
},
gridLines: {
color: "rgb(234, 236, 244)",
zeroLineColor: "rgb(234, 236, 244)",
drawBorder: false,
borderDash: [2],
zeroLineBorderDash: [2]
}
}],
},
legend: {
display: false
},
tooltips: {
titleMarginBottom: 10,
titleFontColor: '#6e707e',
titleFontSize: 14,
backgroundColor: "rgb(255,255,255)",
bodyFontColor: "#858796",
borderColor: '#dddfeb',
borderWidth: 1,
xPadding: 15,
yPadding: 15,
displayColors: false,
caretPadding: 10,
callbacks: {
label: function(tooltipItem, chart) {
var datasetLabel = chart.datasets[tooltipItem.datasetIndex].label || '';
return datasetLabel + ': KM' + number_format(tooltipItem.yLabel);
}
}
},
}
});
},
});
});
[{"clanarina":"240","vakufnama":"12500","zekjat":"0","year":"2019"},{"clanarina":"240","vakufnama":"0","zekjat":"0","year":"2021"},{"clanarina":"240","vakufnama":"0","zekjat":"0","year":"2022"},{"clanarina":"240","vakufnama":"0","zekjat":"0","year":"2023"},{"clanarina":"240","vakufnama":"0","zekjat":"0","year":"2024"},{"clanarina":"240","vakufnama":"0","zekjat":"0","year":"2025"}] chart-bar-demo.js:10:15
Array(385) [ undefined, undefined, undefined, undefined, undefined, undefined, undefined, undefined, undefined, undefined, … ]
chart-bar-demo.js:22:15
Array(385) [ undefined, undefined, undefined, undefined, undefined, undefined, undefined, undefined, undefined, undefined, … ]
chart-bar-demo.js:23:15
Array(385) [ undefined, undefined, undefined, undefined, undefined, undefined, undefined, undefined, undefined, undefined, … ]
chart-bar-demo.js:24:15