AvalynxAutocomplete Live Demo

Download Back To CSSScript.Com

Interactive coverage of single-select, multi-select, inline tags, async data, default values, keyboard control, and API actions.

Selection Modes Single + Multi
Data Sources Static + Async
Tag Layout Above + Inline
Clear Styles Button + Icon

Single Select

Button Clear

Static data, maxItems: 6, minLength: 1

Icon Clear

Case-sensitive search, minLength: 2

Preselected Value

defaultKey + defaultValue

Async Fetch

fetchData, debounce: 500ms, minLength: 2

Multi Select

Tags Above (Button)

maxSelections: 5, defaultSelections

Tags Above (Icon)

fetchData async, noResults override

Inline Tags (Button)

tagsPosition: inline, maxSelections: 4

Inline Tags (Icon)

disabled on load, then enable via API

API Actions + Events

Control Panel

disable, enable, clear, set value
Actions operate across every instance.

Event Console

onChange + onClear output