如何修复Ajax无法从数据库获取任何内容?

时间:2019-02-09 07:54:09

标签: javascript php jquery html object

我很难在此代码中发现我的错误。我有一个搜索栏,并且我将使用ajax,以便自动获取数据。


这是我的html文件。


    <!DOCTYPE html>
    <html>
    <head>
        <title></title>
        <script src="bootstrap4/jquery/jquery.js"></script>
        <script>
             function loadproducts()
    {
        var name = document.getElementById("search");
        if(name)
        {
            $.ajax({
                type: 'post',
                contentType:false,
                cache: false,
                processData:false,
                data: {
                    products:name,
                },
                url: 'loadproducts.php',
                success: function (response){
                    $('#product_area').html(response);
                }
            });
        }
        else
        {
            $('#product_area').html("No Product found!");
        }
    }
</script>
</head>
<body>
<input type="text" name="search" id="search" onkeyup="loadproducts();">
<div id="product_area">

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

----------
This is my loadproducts.php file



<?php
    include('server/connection.php');

    if (isset($_POST['products'])){

        $name = mysqli_real_escape_string($db,$_POST['products']);

        $show   = "SELECT product_name,sell_price FROM products WHERE product_name LIKE '$name%' ";
        $query  = mysqli_query($db,$show);
        if(mysqli_num_rows($query)>0){
            while($row = mysqli_fetch_array($query)){
                echo "<p>".$row['product_name']."</p>";
                echo "<p>".$row['sell_price']."</p>";
            }
        }
    }

我会试着把alert(“称为”); ajax成功运行,并且警报已激活,但仍未显示任何输出。我也将var name = document.getElementById("search");修改为var name = document.getElementById("#search");,但它直接传递给else语句。有人可以找到此代码的问题吗?

1 个答案:

答案 0 :(得分:2)

当前,您正在访问实际的HTML元素。您需要该值,因此请使用.value

var name = document.getElementById("search").value;

或者,如果您愿意,可以使用jQuery简化此操作:

var name = $("#search").val();