ajax-autocomplete.php

<!--- Start : Ajax Auto Complete --->
<script type="text/javascript" src="js/jquery.js"></script>
<script type='text/javascript' src='js/jquery.autocomplete.js'></script>
<link rel="stylesheet" type="text/css" href="css/jquery.autocomplete.css" />

<script type="text/javascript">
$(document).ready(function() {
	$("#CountryName").autocomplete("get_countries_list.php", {
		width: 260,
		matchContains: true,
		max: 20,
		cacheLength: 10,
		selectFirst: false
	});

	$("#CountryName").result(function(event, data, formatted)
	{
	  $("#CountryID").val(data[1]);
	});
});
</script>
<!--- End : Ajax Auto Complete --->	



<form action="##" method="post">
<table border="0" align="center" cellpadding="0" cellspacing="0">
<tr> 
<td>
<input type="hidden" name="CountryID" id="CountryID" />
<input type="text" name="CountryName" id="CountryName" maxlength="100" value="">
</td>
<td>
<input type="submit" value="Search" align="absmiddle">
</td>
</tr>
</table>
</form>  

get_countries_list.php

<?php 
/*Start : Connect To Database*/
 $con = mysql_pconnect('localhost', 'root', 'pinturp1');
 if (!$con)
 {
   die('Could not connect: ' . mysql_error());
 }
 mysql_select_db("shemadb", $con);
/*Start : Connect To Database*/



/*Get records by Search Keyword*/
$sQuery 	= mysql_query("select * from shema_countries where ctr_name like '%$_REQUEST[q]%'");

while($aQuery = mysql_fetch_array($sQuery))
{
	echo $aQuery['ctr_name']."|".$aQuery['ctr_id']."\n";
}

echo $_REQUEST['q'];
?>