Question

我当前正在尝试将数据库返回的数据显示到php显示页面上。我一直在遵循本教程： https://www.phpzag.com/ajax-drop-down-selection-data-load-with-php-mysql/

起初，我尝试使用它来测试我的数据。但是我发现它工作不正确。因此，我决定使用系统上的教程中提供的示例数据来查看问题出在哪里。因此，我的页面如下：

populatePage.php <---这是我在教程中的“ index.php”

<?php
require_once('../../config/sessionHandler.php'); 
?>
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.0/css/bootstrap.min.css">
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.0/js/bootstrap.min.js"></script>
    <script type="text/javascript" src="src/populatePage.js"></script>

    <title>Populate Page</title>
</head>
<body >
    <div class="page-header">
        <h3>
            <select id="employee">
                <option value="" selected="selected">Select Employee Name</option>
                    <?php
                    $sql = "SELECT id, employee_name, employee_salary, employee_age FROM employee LIMIT 10";
                    $resultset = mysqli_query($conn, $sql) or die("database error:". mysqli_error($conn));
                    while( $rows = mysqli_fetch_assoc($resultset) ) {
                    ?>
                <option value="<?php echo $rows["id"]; ?>"><?php echo $rows["employee_name"]; ?></option>
                    <?php } ?>
            </select>
        </h3>
    </div>
    <div id="display">
        <div id="heading" class="row">
            <h3>

            </h3>
        </div>
        <div id="records" class="row">
            <h3>

            </h3>
        </div>
    </div>
</body>
</html>

populatePage.js <---我从教程重命名的getData.js版本

$(document).ready(function(){
// code to get all records from table via select box
$("#employee").change(function() {
var id = $(this).find(":selected").val();
var dataString = 'empid='+ id;
$.ajax({
url: 'popJax.php',
dataType: "json",
data: dataString,
cache: false,
success: function(employeeData) {
if(employeeData) {
$("#heading").show();
$("#no_records").hide();
$("#emp_name").text(employeeData.employee_name);
$("#emp_age").text(employeeData.employee_age);
$("#emp_salary").text(employeeData.employee_salary);
$("#records").show();
} else {
$("#heading").hide();
$("#records").hide();
$("#no_records").show();
}
}
});
})
});

popJax.php <---这是本教程中的我的getEmployee.php

<?php
require_once('../../config/sessionHandler.php');

$_SESSION['PopulateWorking'] = true;

if($_REQUEST['empid']) 
    {
        $sql = "SELECT id, employee_name, employee_salary, employee_age FROM    employee WHERE id='".$_REQUEST['empid']."'";
        $resultset = mysqli_query($conn, $sql) or die("database error:". mysqli_error($conn));
        $data = array();

        while( $rows = mysqli_fetch_assoc($resultset) ) 
            {
                $data = $rows;
            }
            echo json_encode($data);
    } 
else 
    {
        echo 0;
        $_SESSION['Fail'] = true;
    }

?>>

我的sessionHandler用于实现数据库连接和会话验证。

我跟随了本教程。到目前为止，我的系统将：

-从表中检索用户。

-使用下拉列表填充下拉列表。

-允许我选择一个用户。

-将$ _SESSION ['PopulateWorking']显示为“ true”

AND

-当我在JS调试器中观看员工数据时，请正确通读。

但是在这些方面，我缺少一些东西。我经常使用AJAX，PHP和SQL。但是我绝不是专家。我在寻找缺少整体步骤的地方吗？我只想尝试像他在本教程中一样显示数据。因为这样我就可以微调和更改周围的所有内容，以使其按我希望的方式工作。但是现在，当我单击一个用户时，页面上没有任何填充，就像他的教程中那样。我的工作一直持续到真正重要的部分。显示所选数据。

在他的地雷旁边进行比较时，页面上的任何地方也不会显示：“请选择员工姓名以查看详细信息”？所以我想我在某个地方缺少整个DIV吗？还是不生成它？还是脚本调用不正确？

我似乎无法弄清楚我在哪里错误地利用了JSON数据？

TL; DR：为什么我的页面不能像本教程中那样在页面上显示结果数据？

Answer 1

很抱歉浪费时间。我没有在popJax.php中尝试引用的div

我需要添加

无法将jQuery的SQL AJAX调用结果显示在HTML上

1 个答案: