pablo-abc
Issue with connecting Svelecte autocomplete field to Felte data
Describe the bug
I am attempting to use Svelecte as an autocomplete input field within my form, and I am encountering a problem with connecting it to Felte for data management. The issue is that the data does not update when a new option is selected from the autocomplete dropdown.
Expected behavior: When selecting an option from the Svelecte autocomplete dropdown, the Felte-managed data should update accordingly to reflect the selected option.
Which package/s are you using?
felte (Svelte)
Environment
- Browser: chrome
- Version: felte: 1.2.3
To reproduce
No response
Small reproduction example
https://svelte.dev/repl/5420ffbff15a49978e9feec06539970f?version=3.59.1
Screenshots
No response
Additional context
No response
Svelecte is an example of a component that doesn't work quite well with Felte. The solution would be updating manually the data store on change (by adding this to Svelecte) on:change={(e) => setData('color', e.detail.value)}
Or, if you're going to reuse Svelecte in multiple places with Felte, you may use the createField helper to make it "discoverable" to Felte.
Svelecte uses an HTML select element under the hood, but it's still a problem for Felte for two reasons:
- Programmatically changing the value of an input/select does not trigger any events, so Felte can't catch these changes.
- Svelecte seems to be handling the "selected" value by removing all the
<option>elements from the<select>except the selected ones. This also does not trigger any events and is an unconventional way of handling selection. (And it wouldn't work for multi selection, since no<option>element has aselectedattribute).
