Javascript 数据库查询的结果未显示在我的页面上_Javascript_Php_Html_Mysql_Ajax

Javascript 数据库查询的结果未显示在我的页面上

javascript php html mysql ajax

Javascript 数据库查询的结果未显示在我的页面上,javascript,php,html,mysql,ajax,Javascript,Php,Html,Mysql,Ajax,我试图通过表单提交一个id号，以特定格式在我的网页上显示产品的详细信息。但提交查询时未显示任何数据。我希望将最新检索到的数据附加到提交表单的同一页面上已经存在的数据的下面这是my home.php： <?php ob_start(); session_start(); require_once 'dbconnect.php'; // if session is not set this will redirect to login page if(

我试图通过表单提交一个id号，以特定格式在我的网页上显示产品的详细信息。但提交查询时未显示任何数据。我希望将最新检索到的数据附加到提交表单的同一页面上已经存在的数据的下面

这是my home.php：

<?php
    ob_start();
    session_start();
    require_once 'dbconnect.php';
    // if session is not set this will redirect to login page
    if( !isset($_SESSION['user']) )
    {
        header("Location: index.php");
        exit;
    }
    // select loggedin users detail
    $res=mysqli_query($conn, "SELECT * FROM users WHERE userId=".$_SESSION['user']);
    $userRow=mysqli_fetch_array($res);
?>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
    <head>
        <meta charset="utf-8" />
        <title> ShopNGo </title>
        <link rel="stylesheet" type="text/css" href="style.css">
        <link rel="stylesheet" href="assets/css/bootstrap.min.css" type="text/css"  />
        <link rel="stylesheet" href="style.css" type="text/css" />
        <script src="ajax.googleapis.com/ajax/libs/jquery/3.2.0/jquery.min.js"></script>
        <script>
            $(document).ready(function()
            {
                $("#scan").on('click',function()
                {
                    var id =$("#id").val();
                    $.ajax(
                    {
                        type: "POST",
                        url: "getdata.php",
                        data: {id: id},
                        success: function(data)
                        {
                            $('.results').append(data);
                        }
                    });
                });
            });
        </script>
    </head>
    <body>
        <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">
        <span class="glyphicon glyphicon-user"></span>&nbsp;Hi' <?php echo $userRow['userEmail']; ?>&nbsp;<span class="caret"></span></a>
        <a href="logout.php?logout"><span class="glyphicon glyphicon-log-out"></span>&nbsp;Sign Out</a>
        <header id="header">
            <div class="container">
                <form name="products" method="POST" action="">
                    <br><br>
                    <input type="submit" name="scan" id="scan" value="SCAN">
                    <br><br><br>
                    <input type="text" name="id" id="id">
                </form>
            </div>
        </header>
        <div class="main">
            <table border="0">
                <div class="results" id="results">
                </div>
            </table>
        </div>
    </body>
</html>
<?php ob_end_flush(); ?>

这是我的getdata.php：

$query = "SELECT name, price, img FROM product WHERE id = $_POST[id]";
$result = mysqli_query($conn, $query);
if(mysqli_num_rows($result) > 0)
{
    while($row = mysqli_fetch_assoc($result)) 
    {
        $element = "<tr> <table border='0'> <tr>";
        $element .= "<img src='$row[img]'>";
        $element .= "<br>";
        $element .= $row["name"];
        $element .= "<br>";
        $element .= $row["price"];
        $element .= "</tr> </table> </tr>";
    }
}
echo $element;

这是dbconnect.php

<?php
    // this will avoid mysql_connect() deprecation error.
    error_reporting( ~E_DEPRECATED & ~E_NOTICE );
    // but I strongly suggest you to use PDO or MySQLi.

    $servername = "localhost";
    $username = "#usernasme";
    $password = "#password";
    $dbname = "#dbname";

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

    if ( !$conn )
    {
        die("Connection failed : " . mysqli_error());
    }
?>

仅供参考-我正在使用一个php脚本来维护一个连接到数据库的用户登录会话，并在用户注销之前保持用户登录。这两个脚本之间是否存在任何干扰：一个用于维护用户会话，另一个用于访问数据库以获取产品详细信息。提前感谢。

您没有通过ajax发送任何数据；我假设您正确地包含了jquery；那就试试这个

$(document).ready(function(){

  $("#scan").on('click',function(){
      var id =$("#id").val();
      $.ajax({
               type: "POST",
               url: "getdata.php",
               data: {id: id},
               success: function(data){
               $('.results').append(data);
              }
      });

    });

  });

祝您好运

Jquery脚本链接在哪里？首先，假设您包括Jquery库，那么这里有一个语法错误：$'results'。appenddata；它应该是$'.results'.appenddata；我对jquery库一无所知。如何包括它以及在哪里？请帮助@lazy\u coderDo您是否有任何错误，或者出现了什么问题？您成功地继承了post变量吗？我不知道jquery库。如何包括它以及在哪里？请帮助@lazy_coderput这个我按照你说的编辑了代码。。。但问题依然存在。。。请尽快帮忙。另外，请阅读最后的fyi一次。。谢谢