使用PHP,AJAX和jQuery搜索MySQL数据库

问题描述:

我正在尝试编写一个非常简单的搜索系统,用户在一个只有大约50个条目的小型数据库中搜索产品。我正在尝试使用jQuery和AJAX将搜索查询发送到外部PHP脚本,该脚本执行实际的MySQL查询并返回结果列表,然后我可以将其附加到搜索页面。

I'm trying to write a very simple search system where the user searches for a product in a small database of only about 50 entries. I'm trying to use jQuery and AJAX to send the search query to an external PHP script which performs the actual MySQL query and returns a list of results which I can then append on to the search page.

我的搜索页面有这个:

<form method="get">
   <input type="text" id="searchbox" name="search"/>
   <button class="button" id="searchbutton">Search</button>
</form>


<script type="text/javascript">

    function makeAjaxRequest() {
    $.ajax({
        url: 'search_execute.php',
        type: 'get',
        datatype: 'html',
        data: {search: $('#searchbox').val()},
        success: function(response) {
            alert("Success!");
        }, error : function() {
            alert("Something went wrong!");
       }
    });


});

//capture user clicking button
$('#searchbutton').click(function(){
     makeAjaxRequest();
});

//capture user pressing 'return'
$('form').submit(function(e){
    e.preventDefault();
    makeAjaxRequest();
});      

</script>

当然,我只是使用警报进行调试。

Naturally here I'm just using alerts for debugging.

这是来自外部脚本的我的PHP:

Here's my PHP from the external script:

<?php
require('connection.php');

if(isset($_GET['search'])) {
    $search = $_GET['search'];
    echo $search;
    $stmt = $dbc->prepare("SELECT product_id, product_name FROM products WHERE product_name LIKE '%' ? '%'");
    $stmt -> execute(array($search));
    $num = $stmt->rowCount();
}
if ($num == 0){
    echo "<p>Sorry, no products matched your search</p>";
} else {
    if ($num == 1){
            echo '<p>We have found 1 product that matches your search terms. Please click the link to visit the product page.</p>';
        } else {
            echo '<p>We have found '.$num.' products that match your search terms. Please click a link to visit the product page.</p>';
        }
        echo '<ul class="products>';
        while($row = $stmt->fetch(PDO::FETCH_ASSOC)){
            echo '<li><h3><a href="product.php?id='.$row['product_id'].'">'.$row['product_name'].'</a></h3></li>';
        }
    echo '</ul>';
}

?>

问题是,它失败了,并且它无声地失败。我在控制台中没有任何警报,也没有错误, PHP或Firebug.PHP可以单独使用,但是当我使用搜索页面时 - bupkus。

The problem is, it fails, and it fails silently. I get no alert either way and no errors in the console, or Firebug. The PHP works fine in isolation, but when I use the search page - bupkus.

编辑:我已将事件处理程序移到 makeAjaxRequest 功能但仍然没有骰子。

I've moved the event handlers outside the makeAjaxRequest function but still no dice.

您的Javascript代码不正确,事件你在函数 makeAjaxRequest 中添加的函数,因此它从未调用过。它应该是

Your Javascript code is not correct, the event functions you have added inside the function makeAjaxRequest and hence its never called. It should be as

<script type="text/javascript">
$(document).ready(function(){
    function makeAjaxRequest() {
        $.ajax({
            url: 'search_execute.php',
            type: 'get',
            datatype: 'html',
            data: {search: $('#searchbox').val()},
            success: function(response) {
                    alert("Success!");
            }, 
            error : function() {
                    alert("Something went wrong!");
            }
        });
    }

    $('#searchbutton').click(function(){
            makeAjaxRequest();
    });

    $('form').submit(function(e){
            e.preventDefault();
            makeAjaxRequest();
    });
});