Ctrl + k
Theme:

FormAutocomplete

FormAutocomplete supports all props and events of Autocomplete and also have some additional features
Apple
Orange
Peach
Banana
Apricot
Apple
Orange
Peach
Banana
Apricot
value:
Red
Green
Blue
Yellow
Cyan
Magenta
Black
White
Apple
Orange
Peach
Banana
Apricot
Selected value:
Apple
Orange
Peach
Banana
Apricot
Apple
Orange
Peach
Banana
Apricot
Apple
Orange
Peach
Banana
Apricot
Selected value:
You can have complex objects as item and you can use key prop to extract the data that you need from Autocomplete.
0 - First Item
1 - Second Item
2 - Third Item
3 - Fourth Item
4 - Fifth Item
value: {"id":"third","value":"Third Item"}
You can set the valid or invalid boolean properties to apply the valid or invalid state to a Autocomplete.
No result
No result
No result
Apple
Orange
Peach
Banana
Apricot
value:
Apple
Orange
Peach
Banana
Apricot
value: Apple
Apple
Orange
Peach
Banana
Apricot
value: Apple
Apple
Orange
Peach
Banana
Apricot
value:
a
b
c
d
e
f
changed: 0
No result
You can set a message below of Autocomplete like this
Red
Green
Blue
GHI
Cyan
DEF
Black
ABC
choose your favorite color
GHI
Red
Green
Blue
Cyan
DEF
Black
ABC
GHI is not a valid color name.
Red
Green
Blue
GHI
Cyan
DEF
Black
ABC
This color name is valid.
You can customize options of FormAutocomplete like this:
PayPal
Master Card
Visa
method_id:
You can set width of each Form elements in a form using col prop.
Red
Green
Blue
Yellow
Cyan
Magenta
Black
White
Red
Green
Blue
Yellow
Cyan
Magenta
Black
White
Red
Green
Blue
Yellow
Cyan
Magenta
Black
White
Red
Green
Blue
Yellow
Cyan
Magenta
Black
White
You can mark it as a required field like this.
Red
Green
Blue
Yellow
Cyan
Magenta
Black
White
Red
Green
Blue
Yellow
Cyan
Magenta
Black
White
2 - Third Item
0 - First Item
1 - Second Item
3 - Fourth Item
4 - Fifth Item
2 - Third Item
0 - First Item
1 - Second Item
3 - Fourth Item
4 - Fifth Item
value: {"id":"third","value":"Third Item"}
© 2025 YeSvelte. All Rights Reserved