Search with autosuggest feature

Are you an Ajax newbie and are you looking for a simple way to implement autosuggest feature for your PHP site?

This tutorial explains how to implement a simple PHP ajax search with autosuggest feature using some lines of PHP and Javascript code. The result is like this:


How it works
The package contains:

- index.php (search form)
- config.php (MySQL connection's parameters. Change them!)
- search.php (PHP code to execute query)
- ajax_framework.js (javascript functions to enable ajax feature)

When an user type a string in the input field with id "search-q" the function autosuggest() searches the current string into a database table...

<input name="search-q" id="search-q" type="text" onkeyup="javascript:autosuggest()"/>
<div id="results"></div>

... and the script shows search results into the <div> with id "result".

All files are fully customizable. Remeber to change connection's parameter in config.php and SQL code for $getRecord_sql query in search.php. I used a generic query in search.php... change the code in bold changing table name (INVENTORY) and table field (TAG):

$getRecord_sql = 'SELECT * FROM INVENTORY WHERE TAG LIKE "'.$searchq.'%"';

Download this tutorial