Jquery自动完成

时间:2010-08-12 20:15:43

标签: php jquery

我有这样的mysql表:

 country   | city_accented |   latitude   |    longitude |
 ---------------------------------------------------------
 australia |    sydney     | -33.8833333  |  151.2166667 |
    USA    |    dallas     |  35.3163889  |  -81.1763889 |

我正在使用jquery自动填充功能在表单文本字段中获取国家/地区名称。 如何使用此Jquery函数将所有其他数据从数据库(纬度,经度,...)发布到我的表单并在那里使用它像隐藏字段?

Jquery代码:

function lookup(inputString) {
if(inputString.length == 0) {
    // Hide the suggestion box.
    $('#suggestions').hide();
} else {
    $.post("rpc.php", {queryString: ""+inputString+""}, function(data){
        if(data.length >0) {
            $('#suggestions').show();
            $('#autoSuggestionsList').html(data);
        }
    });
}
} // lookup

function fill(thisValue) {
$('#inputString').val(thisValue);
$('#suggestions').hide();
}

HTML:

<input size="30" id="inputString" onkeyup="lookup(this.value);" type="text" />
<div class="suggestionsBox" id="suggestions" style="display: none;">
<div class="suggestionList" id="autoSuggestionsList"></div>

PHP:

if(isset($_POST['queryString'])) {
$queryString = $_POST['queryString'];       
if(strlen($queryString) >0) {
$query = "SELECT * FROM cities WHERE city_accented LIKE '$queryString%' LIMIT 10";
$result = mysql_query($query) or die("There is an error in database");
while($row = mysql_fetch_array($result)){
echo '<li onClick="fill(\''.$row['city_accented'].'\');">'.$row['city_accented'].','.$row['country'].' </li>';                                        
}
}
}

2 个答案:

答案 0 :(得分:0)

我不会发布html,而是将json对象发回,并在客户端构建所需的html。所以你可以从mysql调用中恢复你的数组并将其提交回来:

$return_results = array();

while($row = mysql_fetch_array($result))
{
$return_results[] = $row;                      
}

echo json_encode($return_results);

然后在javascript代码中,您可以使用该数组来对数据执行任何操作。创建li项目。使用数据创建隐藏字段。不管。

答案 1 :(得分:0)

看一下这篇文章的答案。基本上,您可以自定义自动完成插件,并使用您发回的数据部分在单独的隐藏字段中显示和使用!

Jquery autocomplete - strip tags to enter into input