With so many Ajax scripts available now, Auto-complete and Auto-Suggest have come a long way from just a drop down based suggest to a sleek auto-suggest feature and one example is Facebook which has an excellent auto-complete feature while searching friends. Find below is a list of 10 cool auto-complete scripts using Ajax/jQuery/MooTools/Prototype which can make your site better. Have fun!

Related posts:

1. FCBKcomplete – jQuery Plugin

Fancy Facebook-like dynamic inputs with auto complete and pre added values.

2. AutoCompleter Script

Provides the functionality for text suggestion and completion. It features different data-sources (local, JSON or XML), a variety of user interactions, custom formatting, multiple selection, animations and much more.

3. Apple.com style search suggestion using jQuery

Create a fancy apple.com-style search suggestion using jQuery/CSS/PHP. This example makes use of several techniques: MySQL (for the database), HTML/CSS for styling, PHP for retrieving the data and jQuery for the AJAX request.

4. Lite Weight AutoComplete using Prototype

Allows you to easily create autocomplete/autosuggest boxes for text input fields. This script provides a good performance by caching every query & accessing local cache for every subsequent query.

5. Add Auto-Complete feature to your InputBox using jQuery

AutoComplete an input field to enable users quickly finding and selecting some value, leveraging searching and filtering.

6. Feature packed Auto-Complete feature using YUI

Yahoo UI library has an excellent tutorial on adding an auto-complete feature. It has features to configure your data source as well as skin your auto-complete section.

7. Smooth Auto-complete using Prototype/Scriptaculous

A smooth slide down effect for auto-suggest feature which can access response from a data dictionary in JSON/plain text format.

8. Auto Complete using Adobe Spry

This tutorial is on auto-complete with awesome features and examples to source data from various data sets & also integrate in different programming languages such as PHP, Coldfusion and ASP.

9. Sleek Auto Complete using Ajax

The AutoSuggest class adds a pull down menu of suggested values to a text field. The user can either click directly on a suggestion to enter it into the field, or navigate the list using the up and down arrow keys, selecting a value using the enter key.

10. DHTML based AutoComplete

This tutorial gives you an insight into adding an auto-complete feature to a dropdown using DHTML.

Sam Deering is a Front-end Web Developer who specialises in JavaScript & jQuery. Sam is driven and passionate about sharing his knowledge to educate others.

Free Guide:

How to Choose the Right Charting Library for Your Application

How do you make sure that the charting library you choose has everything you need? Sign up to receive this detailed guide from FusionCharts, which explores all the factors you need to consider before making the decision.

Ending Soon
Free SitePoint Premium

Get one free year of unlimited book and course downloads on SitePoint Premium!