我正在尝试在文本框中实现实时搜索,来自服务器的选项列表,如果项目不可用,它应该动态添加,就像我输入“gre”并选择它,它应该添加到列表或它应显示在列表的顶部
Codeply: https://www.codeply.com/go/d6WaXok32m
如代码中所指定,元素'entranceExamSearch'输入框包含项目列表
答案 0 :(得分:2)
这段代码会给你一些想法。
<强> HTML:强>
<input type="text" id="searchPro" />
Your all the dynamic result will be show inside the div
<div id="searchLog"></div>
JQuery:
$("#searchPro").autocomplete({
source: function(request,response) {
$.ajax({
url: "php.func.php",
type: "POST",
data: { term: request.term },
success: function (searchData) {
$('#searchLog').html(searchData);
}
})
}
});
PHP:php.func.php
$find = "SELECT *
FROM tbl_products
WHERE (`product_name` LIKE '%".$_REQUEST['term']."%')";
$resset = $conn->query($find);
while ($res = mysqli_fetch_object($resset)) {
$findRes[] = $res;
}
if (!empty($findRes)) {
foreach ($findRes as $ResultSet) {
echo "<tr><td>".$ResultSet->product_name."</td>";
}
}else{
echo "<p>No Result Found for keyword <b>".$_REQUEST['term']."</b>..<p><hr/>";
}
这是链接:[JQuery Autocomplete] [1]
这是我在项目中使用的基本参考代码。你可以根据需要修改。希望这会帮助你。 更多https://jqueryui.com/autocomplete/