JSFiddle - React, Tailwind, and code Playground
HTML
<html><head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.12.1/jquery-ui.min.js"></script>
<script>
$(function(){
$("#sugg\").autocomplete({
source: "sugg.php",
autoFocus: false,
select: function(event, ui) {
$("#sugg").val(ui.item.label);
$("#formid").submit(); }
});
});
</script>
</head><body>
<form id="formid" action="file.php" method="post">
<p>Enter text</p>
<input id="sugg" type="text" name="forme" class="barre" onkeyup="autocomplet()">
</form></body></html>
JavaScript
<?php
$dbHost = 'localhost';
$dbUsername = 'username';
$dbPassword = 'password';
$dbName = 'dbname';
$db = new mysqli($dbHost, $dbUsername, $dbPassword, $dbName);
$searchTerm = utf8_decode($_GET['term']);
$query = $db->query("SELECT * FROM table WHERE column LIKE '%".$searchTerm."%' LIMIT 10");
$sugg = array();
if($query->num_rows > 0){
while($row = $query->fetch_assoc()){
$data['value'] = $row['column'];
array_push($sugg, utf8_encode($data['value']));
}
}
echo json_encode($sugg);
?>