所以我有这个代码,我用于搜索框(就像我们在google中一样,自动搜索)。 在下面的示例中,值为硬编码,但是,我需要在数组中包含动态值。
这是代码: -
<html lang="en">
<head>
<meta charset="utf-8">
<title>jQuery UI Autocomplete - Default functionality</title>
<link rel="stylesheet" href="http://code.jquery.com/ui/1.10.4/themes/smoothness/jquery-ui.css">
<script src="http://code.jquery.com/jquery-1.9.1.js"></script>
<script src="http://code.jquery.com/ui/1.10.4/jquery-ui.js"></script>
<link rel="stylesheet" href="/resources/demos/style.css">
<script>
$(function() {
var availableTags = [
"ActionScript",
"AppleScript",
"Asp",
"BASIC",
"C",
"C++",
"Clojure",
"COBOL",
"ColdFusion",
"Erlang",
"Fortran",
"Groovy",
"Haskell",
"Java",
"JavaScript",
"Lisp",
"Perl",
"PHP",
"Python",
"Ruby",
"Scala",
"Scheme"
];
$( "#tags" ).autocomplete({
source: availableTags
});
});
</script>
</head>
<body>
<div class="ui-widget">
<label for="tags">Tags: </label>
<input id="tags">
</div>
</body>
</html>
我如何在这个地方拥有动态数组? 您可以假设我有一个变量 $ row ,它可以从mysql数据库中动态获取数据(搜索选项)。
谢谢。
编辑: -
获取值的PHP代码: -
<?php
include 'dbconnector.php';
$query="SELECT firstname from users order by userid";
$result=mysql_query($query,$db) or die (mysql_error($db));
$row=mysql_fetch_array($result);
?>
答案 0 :(得分:3)
jQuery UI Autocomplete有一个“远程”数据函数,记录为here。最简单的版本是:
$( "#tags" ).autocomplete({
source: 'script.php'
});
script.php应该返回JSON数据。所以你要从$ row(s)创建一个数组,json_encode它然后返回它。
正如所承诺的,这是一个使用代码作为基础的粗略示例。免责声明:我不是100%熟悉jQuery UI所期望的格式,你应该知道mysql_query()是deprecated,你应该探索mysqli或{{3}等替代方案。 }}
更新了答案,以显示jQuery UI发送的$ _GET ['term']的使用。我假设你正在寻找名字?我正在使用DB列'firstname'。
巨大免责声明:由于您现在将用户生成的字符串传递到数据库查询中,请确保正确清理。我已经使用mysql_real_escape_string()来匹配你的例子,但它已被弃用,你应该调查上面的替代方案。
// Sanitise GET var
$term = mysql_real_escape_string($_GET['term']);
// Add WHERE clause
$query = "SELECT `id`, `firstname` FROM `users` WHERE `firstname` LIKE '%".$term."%' ORDER BY `id`";
$result = mysql_query($query,$db) or die (mysql_error($db));
while($row = mysql_fetch_array($result)){
$array[$row['id']] = $row['firstname'];
}
header('Content-type: application/json');
print json_encode($array);
exit(); // AJAX call, we don't want anything carrying on here