php - 使用 php、mysql 和 jQuery 实现自动完成
问题描述
我正在使用物化自动完成从我的数据库表中获取建议列表。我将源代码作为 php 文件提供,我在其中回显 json 文件。下面是代码。它不工作。为什么?
索引.php
<div class="input-field ">
<input type="text" name="t" id="t" class="autocomplete">
</div>
<script>
$(function () {
$('input.autocomplete').autocomplete({
source: 'suggest.php?key=%QUERY'
});
});
</script>
建议.php
<?php
$key=$_GET['key'];
$array = array();
$conn = mysqli_connect('localhost', 'root', '', 'home_services');
$query= "select * from worker where lname LIKE '%{$key}%'";
$res = mysqli_query($conn, $query);
if($res->num_rows>0){
while($row=$res->fetch_assoc()){
$lname[]= trim($row["lname"]);
}
}
echo json_encode($lname);
?>
解决方案
Materialize 自动完成没有source
自动加载提供的 URL 的选项。
当您查看文档时,您会看到您必须像这样初始化自动完成功能:
$('input.autocomplete').autocomplete({
data: {
"Apple": null,
"Microsoft": null,
"Google": 'https://placehold.it/250x250'
},
});
该data
选项接受带有可选图标字符串的字符串名称。
您需要在初始化自动完成之前提取自动完成数据,并在初始化时向其提供数据:
$(document).ready(function(){
$(document).on('input', 'input.autocomplete', function() {
let inputText = $(this).val();
$.get('suggest.php?key=' + inputText)
.done(function(suggestions) {
$('input.autocomplete').autocomplete({
data: suggestions
});
});
});
});
此外,您还需要调整suggest.php
以生成data
自动完成选项所需格式的 JSON。因此,您需要像这样更改代码:
while($row = $res->fetch_assoc()){
$lname[trim($row["lname"])] = null;
}
编辑:您还使用名称初始化数组,$array
但将内容添加到名为$lname
. 你应该$array = array();
改变$lname = array();
推荐阅读
- django - 从 html 文件中获取数据并将其保存到模型 django
- windows - Selenium 如何点击 Ctrl + p
- crashlytics - 我在哪里可以找到 Fabric setUserIdentifier 键值?
- mysql - SQL 附加列或多对一关系
- r - RTVS 绘图断开 R 会话
- memory - Ubuntu 不使用非活动内存并进行交换。为什么?
- javascript - Reactjs/Javascript 是将二维数组打印到表格中的最有效方法
- google-chrome - 如何在applescript上向下滚动?
- python - 用相同的值填充列,除了组内的第一行
- c# - Crystal Report 在导出为 PDF 时更改拼写