0

我有一个简单的搜索框，它将从我的数据库中的可用条目中设置用户的位置。我正在尝试让 jQuery UI 的自动完成功能正常工作，但遇到了问题。在 Chrome 中打开 JavaScript 控制台后，当我开始键入时，我看不到脚本的响应。

所需的结果是一个下拉自动完成列表，其中列出了“城市，州”格式的城市。我在 SO 上查看了几篇文章，并多次尝试修改我的代码来解决这个问题，但没有运气。提前感谢任何指导/修复。非常感激。

这是我的 jQuery UI 代码（我使用的是 code.jquery.com 托管的最新库）

<script type="text/javascript">
$(document).ready(function()
{
    $('#locale').autocomplete(
    {
        source: "./state_autocomplete.php",
        minLength: 2
    });
});
</script>

这是我的表单代码：

<form name="frm_set_locale" method="post" action="/index2.php">
  <input type="text" name="locale" id="locale" class="textbox">
  <input type="submit" class="button" name="frm_submit_locale" value="Search">
</form>

这是提取信息的 mysqli 脚本

<?php
include "/includes/dbconn.php";

// Query to get the usable locations
    $locale = trim($_GET['term']);
    $return = array();

    $q = "SELECT `city`, `state` FROM `locales` WHERE `city` LIKE '%".$locale."%'";
    $r = mysqli_query($q, $connect);

    $json = "[";
    $first = true;

    while ($row = mysqli_fetch_assoc($r, $connect)){
        if(!$first){
            $json .=  ",";
        }else{
            $first = false;
        }

        $json .= "{'value':'".$row['city'].", ".$row['state']."}";
    }

    $json .= "]";

    echo $json;
?>
4

3 回答 3

3

第一个状态值的文字是必需的。

"{'value':'".$row['city'].", 'state':".$row['state']."}"

第二你必须通过 Ajax 发布请求数据

<script type="text/javascript">
$(document).ready(function()
{
          $.ajax({
               url: '/state_autocomplete.php',
               type: 'POST',
               dataType: 'json',
               success: function(data){
                     $('#locale').autocomplete(
                     {
                           source: data,
                           minLength: 2
                     });
               }
          });
});
</script>
于 2013-03-19T15:55:33.120 回答
3

感谢所有的帮助。我对 state_autocomplete.php 采用了一种新方法，这就是它对我有用的原因。真的很干净。

<?php
// Database Connection
    include "/includes/dbconn.php";

// Query to get the usable locations
    $locale = $_GET['term'];

    $q = "SELECT `city`, `state` FROM `locales` WHERE `city` LIKE '%$locale%'";
    $r = mysqli_query($connect, $q);            

    $city_state = array();
    while($row = mysqli_fetch_assoc($r)){
        $result = $row['city'].", ".$row['state'];
        array_push($city_state, $result);
    }
    $json = json_encode($city_state);
    echo $json;
?>
于 2013-03-19T16:28:52.333 回答
0

您正在使用的自动完成功能不会按照您的预期使用查询字符串进行 ajax 调用<input type="text" name="locale" id="locale" class="textbox">

因为它工作改变

$q = "SELECT `city`, `state` FROM `locales` WHERE `city` LIKE '%".$locale."%'";

到

$q = "SELECT `city`, `state` FROM `locales`";

然后脚本将生成所有城市和州，然后自动完成功能将匹配用户输入。

于 2013-03-19T16:11:23.347 回答