Autocomplete text field and hidden field

[cuttsadi]

Hi,

I need to autocomplete a text field (values from mySql db) when a user starts typing but also add the unique auto increment Id in a hidden field of whatever they end up selecting to input into a db table once the form is submitted.

I’m trying to work it out using json_encode and the array is generated as a user types using the following search.php file

<?php require_once("../incs/connection.php");

if(isset($_GET['tradeDesc'])){
    $searchFor = mysqli_real_escape_string($conn,$_GET['tradeDesc']);
    
    $query = $conn->query("SELECT trade_Id,trade_Description FROM trades WHERE trade_Description LIKE '%".$searchFor."%' ORDER BY trade_Description ASC");
	$data = array();
    while ($row = $query->fetch_assoc()) {
		 array_push($data,$row);
	}
echo json_encode($data);
}

?>

This gives an array like the following if I say start typing the work Plumber

[{"trade_Id":"1124","trade_Description":"Commercial Plumbers"},{"trade_Id":"1808","trade_Description":"Emergency Plumbers"},{"trade_Id":"2352","trade_Description":"Gas Plumbers"}]

I’m not really up on javascript and despite googling not really getting anywhere.

My form fields are as follows…

<input type="text" name="tradeDesc" id="tradeDesc" placeholder="Trade Description"  required>
<input type="hidden" id="tradeId" name="tradeId"/>

Hope I’ve explained myself clear enough and look forward to someone being able to help me out with this.

Thanks

Adi