javascript - 在 PHP 和 JavaScript 之间传递数据？

Question

总体思路是在 div 中绘制某人得分的图表。我有一个按钮，单击该按钮即可运行图形绘制功能。我还有另一个函数，它使用 switch 语句从数据库中检索数据，因为该函数与其他按钮共享。

我的数据检索功能:

var getdata = function(button_id) {
    $.ajax({
        type: "POST",
        url: "../scripts/getdata.php",
        dataType: "html",
        data: {id: button_id},
        success: function(result){
            $("#profilebox").html(result);
        }
    });
};

运行 getdata.php 并将值返回到空白 div 中。

获取数据.php:

<?php
session_start();
$switchcase = $_POST['id'];
$email = $_SESSION['user']['email'];
//connect to database here
$result=mysqli_query($con,"SELECT * FROM users WHERE email = '$email'");
switch ($switchcase) {
    case "profile_home":
        while($row = mysqli_fetch_array($result)) {
        echo $row['username'] . "'s Profile<br><br>";
        echo "Name: " . $row['firstname'] . ' ' . $row['lastname'] . "<br><br>";
        echo "Things I like:<br>";
        echo $row['like'] . "<br><br>";
        echo "Things I dislike:<br>";
        echo $row['dislike'] . "<br><br>";
        echo "Other Sports:<br>";
        echo $row['sports'];
    };
        break;
    case "profile_scores":
        while($row = mysqli_fetch_array($result)) {
        $row['correct'];
        $row['incorrect'];
    };
        break;
    case "profile_merits":
        //CODE GOES HERE;
        break;
    case "profile_help":
        //CODE GOES HERE;
        break;
    case "profile_edit":
        //CODE GOES HERE;
        break;
}
mysqli_close($con);
?>

接收 POSTed div id (profile_scores)，从数据库获取数据，切换到第二种情况。现在问题就出在这里，我不知道如何通过

        $row['correct'];
        $row['incorrect'];

将值返回到原始页面并让它们显示在图表中

/* correct value */

和

/* incorrect value */

是。

图形绘制功能:

function drawVisualization() {

    getdata("profile_scores");

    // Create and populate the data table.
    var data = google.visualization.arrayToDataTable([
        ['', 'Correct', 'Incorrect'],
        ['Scores',  /* correct value */, /* incorrect value */],
    ]);

    var options = {
            'title': 'Total Scores Overall',
            'width': 600,
            'height': 400,
            'hAxis': {title: ''},
            'backgroundColor': 'transparent'
    };
    // Create and draw the visualization.
    new google.visualization.ColumnChart(document.getElementById('profilebox')).
    draw(data, options);
};

此函数是当用户单击按钮时运行的函数，因此它调用 getdata 函数，然后使用从 getdata.php 接收到的值绘制图表。

感谢任何帮助:)

Answer 1

我完全不确定你在要求什么，但这是我的猜测。

如果您希望在情况 2 中从页面上的数据库中获取 $result。然后您可以使用 JSON 将 PHP 数组传递给 Javascript，然后完成其余的工作。就像假设这是你的 switch 语句的第 2 种情况

case "profile_scores":
{
    $row = $result->fetch_array(MYSQLI_NUM);
    echo json_encode($row);
    break;
}

并在你的ajax响应中执行此操作

$.ajax({
    type: "POST",
    url: "../scripts/getdata.php",
    dataType: "html",
    data: {id: button_id},
    success: function(result){
        console.log(result);
        console.log(JSON.parse(result));
        var phparray = JSON.parse(result);
        var correct = phparray[12];   //<---This will return 100 
        var incorrect = phparray[13];  //<---This will return 10
        //I Dont know which one is your correct or incorrect column number but you can have an idea now
    }
});

这样你就可以将 PHP 数组转换为 javascript，这是数据库结果。另外我想建议你纠正 Switch 语法。这不会有太大区别，但应该小心，所以这是正确的语法。

switch($switchcase)
{
   case "case1":
   {
       //Code to go
       break;
   }
   case "case2":
   {
       //Code to go
       break;
   }
   case "case3":
   {
       //Code to go
       break;
   }
}

请注意，我已将 break; 命令放入 Switch Case 中