使用来自 ajax 响应的变量作为 json答案

【问题标题】：Using variable from ajax response as json使用来自 ajax 响应的变量作为 json
【发布时间】：2016-05-07 07:21:14
【问题描述】：

我还是 ajax 和 Jquery 的新手，我将使用 c3.js 以图形方式显示我的数据库，但我不能使用我的 ajax 响应来响应 javascript 变量。这是我来自 response.php 的 JSON 响应

[{"time":"2014-05-20 17:25:00","sensor1":"25","sensor2":"20","sensor3":"31","sensor4":"33","sensor5":"27"},{"time":"2014-05-20 17:26:00","sensor1":"26","sensor2":"23","sensor3":"33","sensor4":"31","sensor5":"23"}]

这是我的 response.php

<?php
$dbhost = "localhost";
$dbuser = "root";
$dbpass = "";
$dbname = "perkebunan";

//Connect to MySQL Server
$server = mysql_connect($dbhost, $dbuser, $dbpass);

//Select Database
mysql_select_db($dbname, $server) or die(mysql_error());
//build query
$query = "SELECT * FROM sensor";    
//Execute query
$qry_result = mysql_query($query) or die(mysql_error());
$results = array();
while($row = mysql_fetch_assoc($qry_result))
{
    $temp = array(
        'time' => $row['time'],
        'sensor1' => $row['sensor1'],
        'sensor2' => $row['sensor2'],
        'sensor3' => $row['sensor3'],
        'sensor4' => $row['sensor4'],
        'sensor5' => $row['sensor5']
    );
    array_push($results,$temp);
}
echo json_encode($results);
?>

这是我的数据库

my database

所以请帮助我对 javascript 中的变量做出 json 响应。这是我的试用 index.php 以使其成为可能。

<html>
<head>
    <!-- Load c3.css -->
    <link href="c3/c3.css" rel="stylesheet" type="text/css">
    <!-- Load d3.js and c3.js -->
    <script src="http://d3js.org/d3.v3.min.js" charset="utf-8"></script>
    <script src="c3/c3.js"></script>
    <script src="jquery-2.2.3.min.js"></script>
    <script src="http://code.jquery.com/jquery-1.11.0.min.js"></script>
</head>
<body>
    <div id="chart"></div>
<script language="javascript" type="text/javascript">  
function graphAjax(){
    var response;
     $.ajax({
        type : 'POST',
        url : 'ajax-example.php',
        dataType : 'json',
        data: { },
        success: function(data){
            response=data;
        }
    });
    var chart = c3.generate({
    bindto: '#chart',
    data: {
        json: {response
            /* I hope this variable response give result like this
            time: [2014-05-20 17:25:00, 2014-05-20 17:26:00, 2014-05-20 17:27:00, 2014-05-20 17:28:00, 2014-05-20 17:29:00],
            sensor1: [25, 26, 27, 28, 29],
            sensor2: [20, 23, 22, 25, 28],
            sensor3: [31, 33, 35, 30, 33],
            sensor4: [33, 31, 28, 25, 27],
            sensor5: [27, 23, 21, 19, 18],
            */
        }
    }
    });
}
</script>

   <input type='button' onclick='graphAjax()' value='Start'/>
</body>
<footer>
</footer>
</html>

感谢您的时间和帮助。

【问题讨论】：

标签： jquery mysql json ajax c3.js

【解决方案1】：

由于 AJAX 是异步工作的，因此您需要某种解决方法。例如，您可以在 success 回调函数中移动生成图表的函数（并定义在添加错误时会发生什么

success: function(data){
            response=data;
            // generate chart here
        },
 error: function () {
            // do something
        },

还要检查this extensive answer 至How do I return the response from an asynchronous call?) 或How to get the ajax response from success and assign it in a variable using jQuery?。

【讨论】：

最后，谢谢你的帮助，现在我的图出来了