jQuery Autocomplete

The jQuery UI Autocomplete widget provides suggestions while you type into the field.

The datasource is a simple JavaScript array, provided to the widget using the source-option.

The callback datasource gets two arguments:

A request object, with a single property called "term", which refers to the value currently in the text input. For example, when the user entered "new" in a city field, the Autocomplete term will equal "new".

A response callback, which expects a single argument to contain the data to suggest to the user. This data should be filtered based on the provided term, and can be in any of the formats described above for simple local data (String-Array or Object-Array with label/value/both properties). The selection of the data can come from a remote database in JSON response via AJAX.

The jQuery UI Autocomplete plugin uses the jQuery UI CSS Framework to style its look and feel, including colors and background textures. We recommend using the ThemeRoller tool to create and download custom themes that are easy to build and maintain.

If a deeper level of customization is needed, there are widget-specific classes referenced within the jquery.ui.autocomplete.css stylesheet that can be modified. The developer may implement custom render item.