Back



This example shows a multi-select autocomplete where selected tags are displayed above the input field, and a clear icon is used.
Multi-select (Tags above, Icon)

Source of exampleCopy to clipboard


const priorityAutocomplete = new AvalynxAutocomplete('#prioritySearch', {
    data: priorities,
    maxSelections: 4,
    tagsPosition: 'above',
    clearStyle: 'icon',
    defaultSelections: [
        { key: 'PRI001', value: 'Critical' },
        { key: 'PRI002', value: 'High' }
    ],
    onChange: (keys, values) => console.log('Priorities:', keys, values)
}, {
    placeholder: 'Add priorities (max. 4)...',
    noResults: 'No priorities found',
    removeTitle: 'Remove'
});
AvalynxAutocomplete on GitHub Avalynx on GitHub