Ajax AutoComplete feature examples in PHP

The function that completes automatically is AutoComplete, the concrete example can look here: http://www.b2c-battery.co.uk

Enter a product model in the search box to see the effect.

Here is an open source code: Autoassist, interested can look at.

The following is a code fragment:

index.htm
<script type="text/javascript" src="javascripts/prototype.js"></script>
<script type="text/javascript" src="javascripts/autoassist.js"></script>
<link rel="stylesheet" type="text/css" href="styles/autoassist.css"/>
<div>
<input type="text" name="keyword" id="keyword"/>
<script type="text/javascript">
Event.observe(window, "load", function() {
var aa = new AutoAssist("keyword", function() {
return "forCSV.php?q=" + this.txtBox.value;
});
});
</script>
</div>

Do not know why can not use keywords to do the name of the text box, I tried for a long time, and later still use keyword, do have to modify the original code.

forCSV.php
<?php
$keyword = $_GET['q'];
$count = 0;
$handle = fopen("products.csv", "r");
while (($data = fgetcsv($handle, 1000)) !== FALSE) {
if (preg_match("/$keyword/i", $data[0])) {
if ($count++ > 10) { break; }
?>
<div onSelect="this.txtBox.value='<?php echo $data[0]; ?>';">
<?php echo $data[0]; ?>
</div>
<?php
}
}
fclose($handle);
if ($count == 0) {
?>
: (, nothing found.
<?php
}
?>

The CSV file in the original example is separated by \ t, and we can separate it with spaces or other, depending on your data structure.

Of course, you can not read the file, change from the database to read materials, no longer nonsense.

The effect chart is as follows: