在JavaScript中的PHP JSON變量

我正在生成一個使用PHP的JSON「文本」，並希望將它包含在同一個文件中的JavaScript中。我覺得我有問題了解java如何處理JSON作爲文本vs作爲對象。在JavaScript中的PHP JSON變量

注意：我將馬上更改mysql到mysqli，只是想讓這個東西先工作。這裏是我的腳本：

<!DOCTYPE html> 
<html> 
<head> 
    <meta http-equiv="content-type" content="text/html; charset=UTF-8"> 
    <title>Knox QA tickets status</title> 
</head> 
<body> 
    <script src="am/amcharts/amcharts.js" type="text/javascript"></script> 
    <script src="am/amcharts/serial.js" type="text/javascript"></script> 

<?php 
    //$subm = "8"; 
    // This is being loaded from a selection html script 
    $subm = $_POST["submoduleID"]; 
    if(!isset($_POST["submoduleID"])) 
    { 
    // set it to the default container if it's not set. 
    $subm = "8"; 
    } 

    // Connect to MySQL 
    $link = mysql_connect('localhost', 'root', 'secret'); 
    if (!$link) { 
     die('Could not connect: ' . mysql_error()); 
    } 

    // Select the data base 
    $db = mysql_select_db('xqa_status', $link); 
    if (!$db) { 
     die ('Error selecting database \'test\' : ' . mysql_error()); 
    } 

    // Fetch the data 
    $query = ("select date, tested, passed from test_status where xqa_id=" . $subm . " order by test_status_id limit 10"); 

    $result = mysql_query($query); 

    // Make a josn formatted output 
    $rows = array(); 
    while ($r = mysql_fetch_assoc($result)) { 
     $rows[] = $r; 
    } 
    $chartData_json = json_encode($rows); 
    print $chartData_json; 
    mysql_close($link); 
?> 


<!-- Custom Function 
    <script> 
    AmCharts.loadJSON = function(file) { 
     // create the request 
     if (window.XMLHttpRequest) { 
     // IE7+, Firefox, Chrome, Opera, Safari 
     var request = new XMLHttpRequest(); 
     } else { 
     // code for IE6, IE5 
     var request = new ActiveXObject('Microsoft.XMLHTTP'); 
     } 

     request.open('GET', file, false); 
     request.send(); 

     // parse adn return the output 
     return eval(request.responseText); 
    }; 
    </script> --> 


<!-- chart container --> 
<div id="chartdiv" style="width: 600px; height: 300px;"></div> 


<!-- the chart code --> 
    <script> 
    var chart; 
    var chartData1 = "<?php echo $chartData_json; ?>"; 
    var myObject = JSON.parse(chartData1, reviver); 
    // create chart 
    AmCharts.ready(function() { 

     // load the data 
     // SERIAL CHART 
     chart = new AmCharts.AmSerialChart(); 
     chart.pathToImages = "am/amcharts/images/"; 
     chart.dataProvider = myObject; 
     chart.categoryField = "date"; 
     chart.dataDateFormat = "YYYY-MM-DD"; 

     // GRAPHS 

     var graph1 = new AmCharts.AmGraph(); 
     graph1.type = "smoothedLine"; 
     graph1.title = "Tested"; 
     graph1.valueField = "tested"; 
     graph1.bullet = "round"; 
     graph1.bulletSize = 5; 
     graph1.bulletBorderColor = "#FFFFFF"; 
     graph1.bulletBorderThickness = 2; 
     graph1.lineThickness = 2; 
     graph1.lineAlpha = 0.5; 
     chart.addGraph(graph1); 

     var graph2 = new AmCharts.AmGraph(); 
     graph2.type = "smoothedLine"; 
     graph2.title = "Passed"; 
     graph2.valueField = "passed"; 
     graph2.bullet = "round"; 
     graph2.bulletSize = 5; 
     graph2.bulletBorderColor = "#FFFFFF"; 
     graph2.bulletBorderThickness = 2; 
     graph2.lineThickness = 2; 
     graph2.lineAlpha = 0.5; 
     chart.addGraph(graph2); 

     // CATEGORY AXIS 
     chart.categoryAxis.parseDates = true; 
     chart.categoryAxis.autoGridCount = false; 
     chart.categoryAxis.gridCout = chartData.length; 
     chart.categoryAxis.gridPosition = "start"; 
     chart.categoryAxis.labelRotation = 90; 

     // LEGEND 
     var legend = new AmCharts.AmLegend(); 
     chart.addLegend(legend); 

     // CURSOR 
     var chartCursor = new AmCharts.ChartCursor(); 
     chartCursor.cursorAlpha = 0; 
     chartCursor.cursorPosition = "mouse"; 
     chartCursor.categoryBalloonDateFormat = "YYYY-MM-DD"; 
     chart.addChartCursor(chartCursor); 

     // SCROLLBAR 
     var chartScrollbar = new AmCharts.ChartScrollbar(); 
     chart.addChartScrollbar(chartScrollbar); 

     // 3D 
     // chart.angle = 30; 
     // chart.depth3D = 15; 



     // WRITE 
     chart.write("chartdiv"); 



    }); 

    </script> 

</body> 
</html>

的JSON輸出的一個例子是這樣的：

[{"date":"2014-01-09","tested":"12","passed":"32"},{"date":"2014-01-10","tested":"12","passed":"34"},{"date":"2014-01-11","tested":"22","passed":"34"},{"date":"2014-01-12","tested":"22","passed":"34"},{"date":"2014-01-13","tested":"40","passed":"34"},{"date":"2014-01-14","tested":"40","passed":"34"},{"date":"2014-01-15","tested":"40","passed":"34"}]

來源

2014-01-27 user3239109

不是很清楚..你確切的問題是什麼？ – meda

在一個文件中混合使用javascript和php，oh我的 – tenub

感謝Patrick，這確實解決了我的問題，但是由於它在「雙引號」內，因此Javascript無法理解JSON作爲對象。 – user3239109

你需要你的PHP的輸出分配到一個Javascript變量：

<script> 
    var json_data=<?php 

... 

?>; 

    // Do stuff with json_data 
</script>

然後json_data將是一個數組或對象在Javascript中（它不是JSON了，因爲JSON將被解析爲數組字面值，而不是字符串）。這很可能是你想要的，因爲那時你可以使用數組，例如json_data[0].data。

來源

2014-01-27 21:11:18 Paulpro

別忘了在你的json周圍添加引號。最好寫下如下內容：var json_data =「<？php print $ sJSON;？>」; – mat

@mat，不會因爲json本身包含引號而導致錯誤，所以當javascript加載它時，會看到像'「{」somevar「：」somevalue「}」''「的錯誤。 Paulpro擁有它的方式，json字符串將被視爲對象字面值。 –

但我確實有這個變量： var chartData1 =「<？php echo $ chartData_json;？>」; 雙引號實際上是問題所在。 – user3239109

在JavaScript中的PHP JSON變量

回答

相關問題