Auto completion for Webpages

In normal input-fields you have some kind of auto completion. The problem: Auto Completion data ist generated from recent inputs. It would be nice to search a database. Here is a solution to this problem.

Try it!

How to integrate

You just have to include the auto_completion.php-file, this includes all other necessary files. If you want to put the files in another dir, then you have to edit this file.

Create a text input in php, e.g.

print "<input name='foo' value='bar' ".autocomp_init("search.php?s=%value%").">";

Parameters for autocomp_init:

url 

The URL should contain %value%, this will be replaced by the value of the input.

search_msg (optional) 

A message, that is shown during search

error (optional) 

A message, that is shown, when nothing could be found

You have to provide the search.php-script. This is called via a XMLHttpRequest, the magic behind AJAX-technology. This script has to return XML-Data. Here is an example script.

<? Header("content-type: text/xml; charset=UTF-8"); ?>
<xml version='1.0' encoding='UTF-8'>
?>
$list=array("Queen", "AC/DC", "Metallica");
foreach($list as $l) {
  if(strpos($l, $_REQUEST[s])!==false)
    print "<ac>$l</ac>\n";
}
<?
</xml>

Important: The data may not include named entities (except >, < and &), you have to provide real chars.

Download

• autocompletion-1.0-rc1.tgz

TODO

• In Konqueror and Opera the whole document scrolls if you use the cursor keys.

• In Internet Explorer keeping cursor keys pressed doesn't scroll

CREDITS

This work was inspired by The mgBox http://www.dcs.lancs.ac.uk/~grill/mgbox/