在表中显示 J 查询的结果

Question

我希望我的jquery的结果显示在我在另一个文件中的表中。

我已尝试更改表的ID，但我的表来自引导程序，因此

如果我更改 ID，css 会更改。我不知道还能做什么。

这些是我的文件

配置.php

<?php

    $servername = "localhost";

$username = "root";

$password = "";

$db = "stock-stock-stock";

// Create connection

$conn = mysqli_connect($servername, $username, $password, $db );

// Check connection

if (!$conn) {

    die("Connection failed: " . mysqli_connect_error());

}

?>

read_students.php

include_once('../config.php');

$sql = "SELECT * FROM games WHERE status='available'";

$query = $conn->query($sql);

$result = array("data" => array());

while($data = $query->fetch_assoc()){

    $checkbox = '<input type="checkbox" class="checkbox" id="checkbox_' . $data['id'] . '" 

value="' . $data['id'] . '" name="groupCheckBox" onchange="enableDeleteAllButton(this)">';

    $image = '<img width="100" height="100" class="" src="' . $data['game_pic'] . '">';

    $buttons = '<a href="game-update.php?$id='. $data['id'] . '" class="btn btn-info btn-sm">

<i class="fa fa-edit" aria-hidden="true"></i></a><a onclick="removeGame(' . $data['id'] . ')" class="btn btn-danger btn-sm"><i class="fa fa-trash" aria-hidden="true"></i></a>';

    // need "data" string

    $result["data"][] = array(

        $checkbox,

        $data['id'],

        $data['game_name'],

        $data['players'],

        $data['game_descrip'],

        $image,

        $data['status'],

        $buttons,

    );

}

echo json_encode($result);

?>

Answer 1

根据我对你的代码的理解，你的PHP代码正在返回这样的数据。<?php&nbsp; &nbsp; $result["data"][] = array(&nbsp; &nbsp; &nbsp; &nbsp; 'checkbox 1',&nbsp; &nbsp; &nbsp; &nbsp; 'id 1',&nbsp; &nbsp; &nbsp; &nbsp; 'game_name 1',&nbsp; &nbsp; &nbsp; &nbsp; 'players 1',&nbsp; &nbsp; &nbsp; &nbsp; 'game_descrip 1',&nbsp; &nbsp; &nbsp; &nbsp; 'image 1' ,&nbsp; &nbsp; &nbsp; &nbsp; 'status 1',&nbsp; &nbsp; &nbsp; &nbsp; 'buttons 1'&nbsp; &nbsp; );&nbsp; &nbsp; $result["data"][] = array(&nbsp; &nbsp; &nbsp; &nbsp; 'checkbox 2',&nbsp; &nbsp; &nbsp; &nbsp; 'id 2',&nbsp; &nbsp; &nbsp; &nbsp; 'game_name 2',&nbsp; &nbsp; &nbsp; &nbsp; 'players 2',&nbsp; &nbsp; &nbsp; &nbsp; 'game_descrip 2',&nbsp; &nbsp; &nbsp; &nbsp; 'image 2' ,&nbsp; &nbsp; &nbsp; &nbsp; 'status 2',&nbsp; &nbsp; &nbsp; &nbsp; 'buttons 2'&nbsp; &nbsp; );&nbsp; &nbsp; echo json_encode($result); // returns data to ajax call?>我看到的问题也存在于您的ajax调用，格式中，请尝试像下面一样更改它。$（document）.ready（函数（） { $.ajax（{ 类型： “POST”， url： “read_students.php”， 成功： 函数（响应） { var jsonData = 响应; 控制台.log（jsonData）; // 此数据将如下所示 game_descrip game_name game_descrip game_name。“按钮 2”]]} } }）;});一旦你得到来自ajax调用的响应，现在让我们处理你的数据。var jsonData = {"data":[["checkbox 1","id 1","game_name 1","players 1","game_descrip 1","image 1","status 1","buttons 1"],["checkbox 2","id 2","game_name 2","players 2","game_descrip 2","image 2","status 2","buttons 2"]]}jsonData.data.forEach(function(v, i){&nbsp; &nbsp; var tbody = $("#myTables").find('tbody'); debugger;&nbsp; tbody.append("<tr><td>"+v[0]+"</td><td>"+v[1]+"</td><td>"+v[2]+"</td><td>"+v[3]+"</td><td>"+v[4]+"</td><td>"+v[5]+"</td><td>"+v[6]+"</td></tr>")})<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script><link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous"><!-- Optional theme --><link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap-theme.min.css" integrity="sha384-rHyoN1iRsVXV4nD0JutlnGaslCJuC7uwjduW9SVrLvRYooPp2bWYgmgJQIXwl/Sp" crossorigin="anonymous"><!-- Latest compiled and minified JavaScript --><script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js" integrity="sha384-Tc5IQib027qvyjSMfHjOMaLkfuWVxZxUPnCJA7l2mCWNIpG9mGCD8wGNIcPD7Txa" crossorigin="anonymous"></script><table class="table table-bordered" id="myTables" width="100%" cellspacing="0">&nbsp; <thead>&nbsp; &nbsp; <tr align="center">&nbsp; &nbsp; &nbsp; <th>Game ID</th>&nbsp; &nbsp; &nbsp; <th>Game Name</th>&nbsp; &nbsp; &nbsp; <th>Category</th>&nbsp; &nbsp; &nbsp; <th>Description</th>&nbsp; &nbsp; &nbsp; <th>Photo</th>&nbsp; &nbsp; &nbsp; <th>Availability</th>&nbsp; &nbsp; &nbsp; <th>Action</th>&nbsp; &nbsp; </tr>&nbsp; </thead>&nbsp; <tbody>&nbsp; </tbody></table>