Making Auto Fill Text Box In php

Some time you need to make an option of auto fill when user start typing in text box then relavent result could display below of text box in drop-down in php like below Example :

<input type="text" name="producttmfg" id="producttmfg" maxlength="30"  class="reg_box" onkeydown="selectManufacture()">  // User to create text box

<span id="loader" style="display:none;"><img src="images/indicator.gif"></span> // User to display loader
<div id="giveopton"></div>  // User to display result in dropdown


<script type="text/javascript">

/*Below function is call when user start typing in text-box and carry record from the data base and display it in drop-down */



  function selectManufacture(){
$("#giveopton").show();
$("#loader").show();
var manuftre=$("#producttmfg").val();
$.post("getManufacture.php", {manufacturer: manuftre}, 
function(response)
{
if(response!=""){
document.getElementById('giveopton').innerHTML=response;
$("#producttmfgloader").hide();
}
}
); 
}
 
/*Below function is call when user point iten from the drop-down and used to display selected text in text box which is user selected from the drop down*/

$('.suggest_links').live('click', function(){
var current = $(this).attr('id');
current = current.replace('suggest_', '');
current = parseInt(current);
for(i=0;i<=30;i++){
if(i == current){
$("#producttmfg").val($('#suggest_'+i).html());
$("#giveopton").hide();
$('#producttmfg').focus();
break;
}
}
});

/*-Below function is used to hide drop-down when user click rest of drop-down options---------- --*/


$(document).click(function(e) {

var isModalBox = (e.target.id == 'giveopton');

if (!isModalBox) {
$('#giveopton').hide();
}


});

</script>

Below is my php code in getManufacture.php file which is call from the selectManufacture()
function :


<?php
include("database_connection.php");
$manufacture=$_POST['manufacturer'];
$query_select="SELECT * FROM manufacturer where manufacturer like '%".$manufacture."%' order by manufacturer asc limit 30";

$sqlformanufacture = mysql_query($query_select);

if(mysql_num_rows($sqlformanufacture)>0){
$i=1;
while($arr=mysql_fetch_assoc($sqlformanufacture)){
$content.="<li class='suggest_links' id='suggest_".$i."'>".$arr['manufacturer']."</li>";
$i++;
}
echo '<ul>'.$content.'</ul>';
}

?>

Below css is call when user hover on drop-down list :

<style>
#giveopton ul{background:#FFFFFF;color:#FF0033;height:auto; max-height:300px;left:38%;overflow-x:hidden;overflow-y:scroll;position:absolute;top:47%;width:53%;z-index:1000;list-style:none;margin:0px;padding:0px}#giveopton ul li{background:#fff;display:block;color:#000;padding-left:10px}#giveopton ul li:hover{background:#d7d7d7;color:#000;cursor:pointer}
<style>