javascript - 通过 jQuery AJAX 将多个数组从 PHP 传递到 Javascript

Question

我正在尝试做的事情:

我试图通过 jQuery 的 AJAX 函数将按下的按钮的 ID 传递到我的 PHP 脚本。然后我使用这些信息运行一个返回 2 行的查询，我将每行保存为一个数组，分别为 $rTitle_array[] 和 $qTitle_array[]，我 json_encode 每个，然后我想将它们发送回我的 index.html 并在我的 generateProblems 函数中使用它们。

遗憾的是，我不知道如何将它们传递回去然后使用它们。

这是我的 JavaScript:

$(function() {
    //Take id of the button pressed and save it as userID
    $("#buttons").find(".btn").click(function() {
        var userID = this.id;
        $.ajax({
            type: "POST",
            url: 'include/responseget.php',
            data: {
                userID: userID
            },
            success: function(data) {
                alert("success!");
            }
        });
    });

    var phase = 0;
    var rTitle = <?php echo json_encode($rTitle_array); ?>;
    var rText = <?php echo json_encode($rText_array); ?>;

    //Function to generate html based on query results
    function generateProblems(param) {
        var problemDef = param;
        $("#buttons").hide();
        var numbers = [1, 2, 3, 4, 5, 6, 7, 8];
        for (var i = 0; i < 8; i++) {
            $('<div>' + rTitle[i] + '</div>').data('number', rTitle[i]).attr('id', 'problem' + rTitle[i]).appendTo('#testpile').draggable({
                containment: '.site-wrapper',
                stack: '#testpile div',
                cursor: 'move',
                revert: true
            });
            $('<div>' + rText[i] + '</div>').data('number', rText[i]).attr('id', 'problem' + rText[i]).appendTo('#testpile');
        }


        $('#testdrop').droppable({
            drop: handleDropEvent,
            accept: '#testpile div'
        });

        //Function to restart generateProblems when draggable is dragged to specific place
        function handleDropEvent(event, ui) {
            var problemNumber = ui.draggable.data('number');
            var problemCombination = problemDef + problemNumber;
            ui.draggable.draggable('disable');
            ui.draggable.draggable('option', 'revert', false);
            phase++;
            alert('ProblemCombination is "' + problemCombination + '", phase is "' + phase + '" ');
            $("#testpile").children().hide();

            generateProblems(problemCombination);

        }
    }
});

这是我的 PHP:

<?php  include 'login.php';
if(isset($_POST['userID'])){
    $id = $_POST['userID'];
    $stmt = $conn->prepare("SELECT DISTINCT AnswerTitle, AnswerText FROM question_answers
    INNER JOIN question
    ON question_answers.QuestionID=question.QuestionID
    INNER JOIN answer
    ON question_answers.AnswerID=answer.AnswerID
    WHERE AnswerGroup = ?;");
    $stmt->bind_param('s', $id);
    $stmt->execute();
    $result = $stmt->get_result();

      while($row = $result->fetch_assoc()) 
      {
          $rTitle_array[] = $row['AnswerTitle'];
          $rText_array[] = $row['AnswerText'];
      }

    echo json_encode($rTitle_array);
    echo json_encode($rText_array);
}

    // close connection
    mysqli_close($conn);
?>

我只是不知道如何正确获取数组或将数组传递回我的 JavaScript，因此我可以将它们用于我的函数。

Answer 1

脚本输出的数据作为脚本的单一响应处理。您可以做的是在服务器端组合两个数组，如下所示:

$response = array(
    'rTitle' => $rTitle_array,
    'rText'  => $rText_array
);

然后对这个组合数组进行json_encode，输出。所以，而不是

echo json_encode($rTitle_array);
echo json_encode($rText_array);

你写

echo json_encode($response);

现在对于客户端，处理响应的一种可能方法是:

1. 更改您的$.ajax 请求，以便通过将dataType 参数设置为'json'.
2. 将您的成功数据视为json!

例子:

var rTitle, rText;

$.ajax({
    type: "POST",
    url: 'include/responseget.php',
    dataType: 'json',
    data: {
        userID: userID
    },
    success: function(json) {
        rTitle = json.rTitle;
        rText  = json.rText;
    }
});