编辑
现在的脚本是:
<script>
$('#tag').keyup(function() {
console.log($(this).val());
var termToSearch = $(this).val();
$(function() {
var availableTags;
$.ajax({
url: 'search_patient.php',
type: 'POST',
data: {term: termToSearch},
dataType: 'JSON',
success:function(output)
{
$.each( output, function(key, row)
{
availableTags = [row['patient_name']];
});
$( "#tags" ).autocomplete({
source: availableTags
});
}
});
});
});
</script>
我可以在控制台中看到值,但仍然没有在搜索文本框中看到任何自动完成。
结束编辑
我正在尝试使用 jquery UI
库来实现自动完成功能,但使用 PHP 和 MySQL 填充数组。
我从 php 和 MySQL 代码开始,我需要根据我在搜索框中输入的内容获取患者姓名(实时自动完成搜索)
<?php
//Set error reporting on
error_reporting(E_ALL);
ini_set("display_errors", 1);
//Include connection file
require_once('../include/global.php');
//Json and PHP header
header('Content-Type: application/json');
//Getting Value from text box
$term = '%'.$_POST['term'].'%';
//Array to get data into it
$response = array();
//Query
$searchPatient = "SELECT * FROM patient WHERE patient_name LIKE :term";
$searchStmt = $conn->prepare($searchPatient);
$searchStmt->bindValue(":term", $term);
$searchStmt->execute();
if($searchStmt->rowCount() > 0){
$output = $searchStmt->fetchall();
foreach ($output as $o){
$response['patient_name'] = $o['patient_name'];
}
return json_encode($response);
}
?>
在页面中我包含了 jquery UI 库,根据他们的推荐,他们使用了以下内容:
<script src="../include/jquery-1.12.1.min.js"></script>
<script src="../include/jquery-ui.min.js"></script>
<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>
我不知道如何使用 $.ajax
从 PHP 获取 $response
数组,并将其设置为 availableTag = response. Patient_name
我将其编辑为:
<script>
$(function() {
var availableTags;
var searchTerm = $("#tag").val();
$.ajax({
url: 'search_patient.php',
data: {term: searchTerm},
type: 'POST',
dataType: 'JSON',
success:function(response)
{
$.each( response, function(key, row)
{
availableTags = row['patient_name'];
});
$( "#tags" ).autocomplete({
source: availableTags
});
}
});
});
</script>
我的 XHR term
为空:
我有这个错误:
Notice: Undefined index: term in C:\wamp\www\dentist\pages\search_patient.php on line 13
编辑 Covic
最佳答案
我认为你应该让所有没有term
的患者。您可以在服务器端创建 JS 数组,但也可以使用 AJAX 来完成。
<?php
//Set error reporting on
error_reporting(E_ALL);
ini_set("display_errors", 1);
//Include connection file
require_once('../include/global.php');
//Json and PHP header
header('Content-Type: application/json');
//Query
$searchPatient = "SELECT patient_name FROM patient";
$searchStmt = $conn->prepare($searchPatient);
$searchStmt->execute();
if($searchStmt->rowCount() > 0){
$output = $searchStmt->fetchall();
$output = array_values($output);
echo json_encode($output);
}
?>
现在在 AJAX 中我们不需要发布数据
<script>
$(function() {
var availableTags = [];
$.ajax({
url: 'search_patient.php',
type: 'POST',
dataType: 'JSON',
success:function(response)
{
$.each( response, function(key, row)
{
availableTags.push(row['patient_name']);
});
$( "#tags" ).autocomplete({
source: availableTags
});
}
});
});
</script>
也许我做错了什么,因为我现在无法测试它,所以如果有任何错误我会修复它
关于php - 使用 php 和 MySQL 将数据获取到 jQuery UI availableTag,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/35740198/