在同一頁面上將F（x）轉換為php到Highchart

Question

我繼續前面的問題，它是在onclick-> mysql query-> javascript上被詢問的； 同一頁

這是我的onchange函數，用於下拉名稱。 每次更改下拉菜單時都會調用它。 想法是將每個跑步者的姓名發送到php頁面以運行mysql查詢，然后返回3個要輸入到javascript中的數組。

function sendCharts() {
var awayTeam = document.getElementById('awayRunner').value;
var homeTeam = document.getElementById('homeRunner').value;        


if(window.XMLHttpRequest) {
    xmlhttp14 = new XMLHttpRequest();

}
else {
    xmlhttp14 = new ActiveXObject("Microsoft.XMLHTTP");
}
xmlhttp14.onreadystatechange = function() {
    if(xmlhttp14.readyState == 4 && xmlhttp14.status == 200) {

   var parts = xmlhttp14.responseText.split(','); //THIS IS WHAT IS RETURNED FROM THE MYSQL QUERY. WHEN I ALERT IT, IT OUTPUTS IN THE FORM 14,15,18,16,17,12,13 

          ... code that generates the chart 
        series: [   {
                        name: document.getElementById('awayRunner').value,
                        data: [parts,','], //THIS IS WHERE AN ARRAY MUST BE ENTERED. THIS OUPUTS ONLY ONE NUMBER 
                        type: 'column',
                        pointStart: 0
                        //pointInterval
                    },

                    {

                        name: document.getElementById('homeRunner').value,
                        data: parts, // TRIED THIS
                        type: 'column',
                        pointStart: 0
                        //pointInterval
                    },

                    {
                        name: 'League Avg',
                        data: [], //THIS IS WHERE 3rd ARRAY MUST BE ENTERED
                        type:'spline',
                        pointStart: 0
                        //pointInterval
                    },
                ]
    });

    }
}
xmlhttp14.open("GET", "getCharts.php?awayRunner="+awayRunner+"&homeRunner="+homeRunner, true);
xmlhttp14.send();

}

我的PHP代碼看起來像這樣。 正如您將看到的，必須返回3個數組才能將它們輸入到javascript中的不同位置以生成代碼。

$away=$_GET['awayRunner'];
$home=$_GET['homeRunner'];

$db=mydb;



$homeRunner=array();
$awayRunner = array();
$totalOverall= array();

$getHome="select column from $db where tmName = '$home'";
$result2 = mysql_query($getHome);
while($row = mysql_fetch_array($result2)){
$homeRunner[]= $row['column'];
}

$getAway="select column from $db where tmName ='$away'";
$result22 = mysql_query($getAway);
while($row2 = mysql_fetch_array($result22)){
$awayRunner[]= $row2['column'];

}

$week = 0;
while($week<20){
$week++;
$teamCount = "select count(column) from $db where week = $week";
$resultTeam =  mysql_query($teamCount);
$rowTeam = mysql_fetch_array($resultTeam);
$t = $rowTeam['count(column)'];

$getLeague = "select sum(column) from $db where week = $week";
$resultLeague = mysql_query($getLeague);
while($row3 = mysql_fetch_array($resultLeague)){
    $totalOverall[]=$row3['sum(column)']/$t;
    }
}
echo join(',',$awayRunner);

當前，通過這種方式，圖表僅輸出數組中的第二個值。 例如，如果var part等於23,25,26,24,23 ...僅顯示25。

前一個問題的答案如下：

1. 加載頁面。
2. 用戶選擇一個選項。
3. 一個onChange偵聽器觸發AJAX請求
4. 服務器接收並處理請求
5. 服務器發回一個JSON數組的選項供相關選擇
6. 客戶端AJAX發送者獲得響應
7. 客戶端更新選擇以具有JSON數組中的值。

我迷上了＃的5-7。有人可以提供示例代碼來完成此操作嗎？ 通常，我只是問路，但是我已經在這個問題上停留了好幾天。 我准備放棄在網站上放置圖表的想法。 提前致謝

EDIT

這是我發送和接收一個請求的第一個更改

<script>
$(function(){
    $("#awayRunner").change(function(){ 
        $.ajax({
        type: "POST",    
        data: "data=" + $("#awayRunner").val(),
        dataType: "json",
        url: "/my.php",
        success: function(response){
            alert(response);  
        }
        });
    });
});

警報框中顯示的數據格式為12,15,16,15。 現在，當我輸入data：響應時，圖表中僅顯示每個數字的第二個數字。 有任何想法嗎？

EDIT

好的，所以我發現響應中的信息是一個字符串。 必須使用parseInt將其轉換為INT，才能在圖表中使用。 目前，我有

$("#awayTeam").change(function(){ 
        $.ajax({
        type: "POST",    
        data: "away=" + $("#awayTeam").val(),
        dataType: "json",
        url: "/getCharts.php",
        success: function(response){
              var asdf = [];
              asdf[0] = parseInt(response[0]);
              asdf[1] = parseInt(response[1]);
              asdf[2] = parseInt(response[2]);
              asdf[3] = parseInt(response[3]); 
              alert(asdf);

將不得不編寫一個函數來使這個更加干凈。

Answer 1

我不敢相信，但我終於明白了。 這是我使用onchange方法刺激MYSQL查詢並讓Highchart顯示結果的方式。 主要問題是返回的JSON數組是需要轉換為INT的字符串。 然后，在highChart的data：部分中使用resultArray變量。

$(function(){
    $("#awayTeam").change(function(){ 
        $.ajax({
        type: "POST",    
        data: "away=" + $("#awayRunner").val(),
        dataType: "json",
        url: "/getCharts.php",
        success: function(response){
              var arrayLength = response.length;
              var resultArray = [];
              var i = 0;
              while(i<arrayLength){
                  resultArray[i] = parseInt(response[i]);
                  i++;
              }            

在PHP代碼中，數組必須像JSON這樣返回

echo json_encode($awayRunner);