[英]How to make the autocomplete Jquery UI plugin dynamic
我从这里使用Jquery UI自动完成插件。 问题是,如何将动态内容插入自动完成功能? 这是我尝试过的:
<?php
$db2 = new mysqli("127.0.0.1", "root", "", "crave crap");
$one_grab = $db2->query("SELECT * FROM movies");
echo '<script>
$(function() {
var availableTags = [
</script>';
while($two_row = mysqli_fetch_array($one_grab)) {
echo $two_row["title"];
}
echo '"ActionScript",
"AppleScript",
"Asp",
"BASIC",
"C",
"C++",
"Clojure",
"COBOL",
"ColdFusion",
"Erlang",
"Fortran",
"Groovy",
"Haskell",
"Java",
"JavaScript",
"Lisp",
"Perl",
"PHP",
"Python",
"Ruby",
"Scala",
"Scheme"
];
$("#delete_movie").autocomplete({
source: availableTags
});
});
</script>';
?>
请假设Jquery和Jquery UI已正确链接...为了进一步说明,我有一个while循环连接到SQL查询。 我试图将其附加到自动完成内容中,但这不起作用。 用Jquery UI自动完成插件执行此操作的正确方法是什么?
编辑@Vijay Arun
这是您发布的代码:
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>jQuery UI Autocomplete - Default functionality</title>
<link rel="stylesheet" href="//code.jquery.com/ui/1.11.4/themes/smoothness/jquery-ui.css">
<script src="//code.jquery.com/jquery-1.10.2.js"></script>
<script src="//code.jquery.com/ui/1.11.4/jquery-ui.js"></script>
<link rel="stylesheet" href="/resources/demos/style.css">
<?php
$db2 = new mysqli("127.0.0.1", "root", "", "crave crap");
$one_grab = $db2->query("SELECT * FROM movies");
while($two_row = mysqli_fetch_array($one_grab)) {
$data[] = $two_row["title"];
}
?>
<script>
$(function() {
var availableTags = "<?php echo json_encode($data); ?>";
$("#delete_movie").autocomplete({
source: JSON.parse(availableTags)
});
});
</script>
</head>
<body>
<div class="ui-widget">
<input id="delete_movie" name="delete_movie" required>
</div>
</body>
</html>
这看起来正确吗? 如果是这样,代码仍然无法正常工作...
使用remote
示例,在php
echo json_encode()
$("#delete_movie").autocomplete({
source: function( request, response ) {
$.ajax({
url: "/path/to/php",
dataType: "json",
data: {
q: request.term
},
success: function( data ) {
response( data );
}
});
})
您需要两个单独的文件, index.php
和suggest.php
index.php
<div class="ui-widget">
<input id="delete_movie" name="delete_movie" required>
</div>
<script>
$(function() {
$( "#delete_movie" ).autocomplete({
source: "suggest.php"
});
</script>
suggest.php
<?php
$db2 = new mysqli("127.0.0.1", "root", "", "crave crap");
$one_grab = $db2->query("SELECT * FROM movies WHERE title LIKE '%{$_GET['term']}%' ");
while($two_row = mysqli_fetch_array($one_grab)) {
$data[] = $two_row["title"];
}
echo json_encode( $data );
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.