尝试编写实时搜索脚本答案

【问题标题】：Attempting to write a livesearch script尝试编写实时搜索脚本
【发布时间】：2013-10-30 12:25:20
【问题描述】：

我是第一次尝试一些 ajax。我正在尝试编写一个实时搜索，在每个输入的字符上都会运行 MySQL 数据库的搜索。

这是我目前的代码：

<!doctype html>
<html lang="en">
    <meta charset="utf-8">

    <script type="text/javascript">
        function getStates(value){
            $.post(
                    "getstates.php",
                    {partialState:value},
                    function(data){
                        $("#results").html(data);
                    });
        }
    </script>


</head>

<body>
    <input type="text" name="input" onkeyup="getStates(this.value)" /><br />
    <div id="results"></div>
</body>
</html>

getStates.php

//test the connection
try{
    //connect to the database
    $dbh = new PDO("mysql:host=127.0.0.1;dbname=livesearch","root", "usbw");

//if there is an error catch it here
} catch( PDOException $e ) {
    //display the error
    echo $e->getMessage();
}


$partialState = $_POST['partialState'];     
$query = $dbh->prepare("SELECT state_name FROM tbl_state WHERE state_name LIKE '%$partialSate%'");      
$query->execute();      
$result = $query->fetchAll();

foreach($result AS $state){

    echo '<div>'.$state['state_name'].'</div>';
}

使用正确的表名等正确构建了 mySQL 数据库。

为什么它没有从数据库返回结果状态？

【问题讨论】：

您浏览器的错误控制台是否提供任何错误？如果您直接在浏览器中请求“getStates.php”并提供所需的 POST 参数，输出如何？
如何在 chrome 中调出错误控制台？
你已经包含了 jquery 库不是吗？你也没有使用准备好的查询的权利..
是的，我链接到 jquery 库，我使用 PDO 连接到数据库！？
尝试在以下行之后执行alert(data);：function(data){，这样我们就可以看到发生了什么。还;在 chrome 中，右键单击网页上的任意位置并选择检查元素，这样您就可以查看代码运行期间是否存在或发生任何错误

标签： php ajax jquery search

【解决方案1】：

问题是你在查询中打错了：

$query = $dbh->prepare("SELECT state_name 
                        FROM tbl_state 
                        WHERE state_name 
                        LIKE '%$partialSate%'");
                                       ^^^^Missing t

应该是

$query = $dbh->prepare("SELECT state_name 
                        FROM tbl_state 
                        WHERE state_name 
                        LIKE '%$partialState%'");

但您也应该正确使用准备好的查询： 固定代码：

<?php
if(isset($_POST['partialState'])){

    //test the connection
    try{
        //connect to the database
        $dbh = new PDO("mysql:host=127.0.0.1;dbname=livesearch","root", "usbw");
        $dbh->setAttribute(PDO::ATTR_ERRMODE, PDO::ERRMODE_EXCEPTION);
        $dbh->setAttribute(PDO::ATTR_EMULATE_PREPARES, false);
        $dbh->setAttribute(PDO::ATTR_DEFAULT_FETCH_MODE,PDO::FETCH_ASSOC);

        //if there is an error catch it here
    } catch( PDOException $e ) {
        //display the error
        echo $e->getMessage();
    }

    $query = $dbh->prepare("SELECT state_name
                            FROM tbl_state
                            WHERE state_name
                            LIKE :like");

    $query->execute(array(':like'=>'%'.$_POST['partialState'].'%'));

    $result = $query->fetchAll();

    foreach($result AS $state){
        echo '<div>'.$state['state_name'].'</div>';
    }
    die();
}
?>

<!doctype html>
<html lang="en">
    <meta charset="utf-8">
    <script src="http://code.jquery.com/jquery-latest.js"></script>
    <script type="text/javascript">
    function getStates(value){
        $.post("index.php", { "partialState":value },
        function(data){
            $("#results").html(data);
        });
    }
    </script>
</head>

<body>
<input type="text" name="input" onkeyup="getStates(this.value)" /><br />
<div id="results"></div>
</body>
</html>

【讨论】：

感谢劳伦斯，由于某种原因 Jquery 无法正常工作，我正在链接到页面顶部的 jquery <script src="http://code.jquery.com/jquery-latest.min.js" type="text/javascript"></script>。
它经过测试，应该可以工作。注意我将$.post("index.php",更改为测试，您可能需要将其更改回$.post("getstates.php",。
Lawrence 我在 jsfiddle 上包含了我的代码：jsfiddle.net/uB5SB getstate.php 只有基本文本，没有别的。为什么这不起作用？