如何修復 Ajax 不從數據庫中獲取任何內容？

Question

我很難在這段代碼中找到我的錯誤。 我有一個搜索欄，我會使用 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>";
            }
        }
    }

我試着把警報（“叫”）; 功能在 ajax 成功並且警報被激活但仍然沒有輸出顯示。 我還編輯了var name = document.getElementById("search"); 到var name = document.getElementById("#search"); 但它直接傳遞給 else 語句。有人可以找到這段代碼的問題嗎？

Answer 1

目前，您正在訪問實際的 HTML 元素。 你想要這個值，所以使用.value ：

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

或者，如果您願意，您可以使用 jQuery 將其簡化：

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

如何修復 Ajax 不從數據庫中獲取任何內容？

問題描述

1 個解決方案

解決方案1
2 已采納 2019-02-09 07:55:29

如何修復 Ajax 不從數據庫中獲取任何內容？

問題描述

1 個解決方案

解決方案1 2 已采納 2019-02-09 07:55:29

解決方案1
2 已采納 2019-02-09 07:55:29