Friday, June 16th, 2006

Using Ajax Agent and PHP for Auto-Complete

Category: PHP, Programming has a new tutorial today from Jay demonstrating how to use the AjaxAgent software (a PHP library) to create an auto-complete text box for your site.

In this HOWTO I will explain how to use AjaxAgent and PHP to create an Ajax Auto-Complete box with a drill-down list of data. Although the state of this Ajax Framework is questionable it is so far the simplest and easiest framework I have found.

The UI is very simple. It consists of a TextBox to enter an Artists’ Name, a selectbox to display the Albums and an unordered list to display the songs on an album. This will be future extended with the ability to drill-down into an Album and get a list of songs.

He breaks it up into three sections – the auto-complete, posting back, and an “on your own” section to test you on the skills you should have learned so far. All of the code is provided for you, save for the database structure they use. It’s a pretty simple setup, though, and would take five minutes (max) for someone familiar with SQL or something like phpMyAdmin to set up.

Posted by Chris Cornutt at 6:55 am

3.8 rating from 107 votes


Comments feed TrackBack URI

Thanks for covering the article on your site. The database structure is in the downloadable source from the link at the top.

Comment by Kevin — June 16, 2006

Yahoo has developed one powerful Auto-Complete UI Control as below:
//quote from Yahoo
The AutoComplete control features navigation of the suggestion container via up/down arrow keys and a rich event model that gives you scriptological access to all of the interaction’s interesting moments. Easily configurable parameters include custom formatting of AutoComplete suggestions, query delimiters (for multiple selections per input box), configurable query delay, type-ahead, animation of the suggestion container, built-in query caching, and much more.

For details, please refer to

Comment by Wendy — June 18, 2006

Good lord, chenggn! $50 for autocomplete code?

Like how you grabbed’s old design and the Yahoo! code beautification script.

Can’t even press Tab to select like you can in Yahoo!’s and’s.

As for the screen cast, your script, Yahoo!’s, and’s all work equally as fast here. The scripts have little to do with how fast the autocomplete loads – the wait time is for the underlying AJAX request – which is being done by the free library Prototype.js in your system!


Comment by ceejayoz — June 21, 2006

i have used this code to display the city names the program is working with all alphabits except k,h,v and some swedish letters Ä,Ö,Å
can you please guide me

Comment by prethum — March 29, 2008

Leave a comment

You must be logged in to post a comment.