autocomplete textbox and hidden field

Hi

My index.php page contains a simple form, a text field which I want to autocomplete from a mySql db, and a hidden field that I want to take on the auto increment unique Id of the autocompleted value from the db.

[code=html]
<input type=”text” name=”tradeDesc” id=”tradeDesc” placeholder=”Trade Description” required>
<input type=”hidden” id=”tradeId” name=”tradeId”/>
[/code]

I know I’m best to use jQuery autocomplete and have a php source file to get results from database and use json_encode to pass back to index.php. I have this seperate fie named search.php as follows….

[code=php]
<?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);
}

?>
[/code]

Let’s say a user wants an emergency plumber and starts to type in “Plumbers”, the returned array will look something like this….

[code=php]
[{“trade_Id”:”1124″,”trade_Description”:”Commercial Plumbers”},{“trade_Id”:”1808″,”trade_Description”:”Emergency Plumbers”},{“trade_Id”:”2352″,”trade_Description”:”Gas Plumbers”}]
[/code]

So when they end up typing in Emergency Plumbers, the hidden field should have a value of trade_Id=1808.

I don’t really have any javascript scills and I’ve googled for ages but can’t seem to get led in the right direction, so am hoping this all makes sense and someone here is able to help me out with this please.

Thank you

Also in #JavaScript _↴