YUI Library Examples: AutoComplete Control: Configurations Dashboard

AutoComplete Control: Configurations Dashboard

This example is designed to allow you to experiment with the various configuration properties provided by AutoComplete and to explore their impact on the interaction. The first field after the AutoComplete input textbox is a select element that allows you to test for bleed-through on Internet Explorer when the AutoComplete suggestion container descends to cover it. The remaining form fields allow you to change property settings on the AutoComplete instance and to see immediately how those changes feel in the browser.

View example in new window.

Search the Web Using Yahoo!'s Search API:

Use the Controls Below to Customize the Behavior of the AutoComplete Instance Above:

Animate Horizontally

Animate Vertically

Animation Speed:

Use Shadow

Use IFrame

Automatically Highlight First Item

Type Ahead

Force a Selection

Maximum Results:

Minimum Query Length:

Query Delay:

TypeAhead Delay:

Delimiter Character(s) like ; or [";", ","]

Highlight Classname

Pre-highlight Classname

Allow Browser Autocomplete

Always Show Container

Set Header

Set Body

Set Footer

YUI Logger Output:

Note: Logging and debugging is currently turned off for this example.

Reload with logging
and debugging enabled.

YUI Library Examples: AutoComplete Control: Configurations Dashboard

YUI Logger Output:

AutoComplete Control Examples:

More AutoComplete Control Resources: