我尝试进行搜索输入,用户可以在其中输入一些关键字,并自动完成数据库中的结果。
我已经完成了将搜索输入设置为自动完成并显示结果,现在唯一缺少的是,当用户按下名称时,它将重定向到该结果的页面。
在这种情况下,我需要将结果id作为参数传递给url。
HTML
<form action="" method="post">
<input type="text" name="clients" id="clients" data-provide="typeahead">
<input type="submit" name="clients_submit" value="Search">
</form>
的jQuery
var clients = new Bloodhound({
datumTokenizer: Bloodhound.tokenizers.obj.whitespace('client_name'),
queryTokenizer: Bloodhound.tokenizers.whitespace,
remote: {
url: './core/views/clients.php?query=%QUERY',
wildcard: '%QUERY'
}
});
clients.initialize();
$("#clients").typeahead({
hint: true,
highlight: true,
minLength: 2
},{
name: 'clients',
displayKey: 'client_name',
source: clients.ttAdapter()
});
PHP
header('Content-Type: application/json');
if(!isset($_GET['query'])){
echo json_encode([]);
exit();
}
$conn = new PDO('mysql:host=localhost;dbname=autocomplete;charset=utf8', "root", "root");
$conn->setAttribute(PDO::ATTR_ERRMODE, PDO::ERRMODE_EXCEPTION);
$clients = $conn->prepare("SELECT client_id, client_name FROM crm_clients WHERE client_name LIKE :query");
$clients->execute([
'query' => "{$_GET['query']}%"
]);
echo json_encode($clients->fetchAll());