Advanced Select (Remote Data, Tags): Two Search Boxes

[akhayyat]

Summary

When using advanced select with remote data and tags style, there are two search boxes, and one of them is dysfunctional.

Steps to Reproduce

1. Go to advanced select - remote data (tags)
2. Click on the select widget to open the dropdown and search box
3. Notice the two search boxes (screenshot below)
4. Use the first search box (visible initially before opening the dropdown). Notice how it appears to search, but does not search properly (wrong results)

Note that although initially the functional search input is focused, once a selection is made, the dysfunctional search input gets focus.

Demo Link

https://preline.co/docs/advanced-select.html#remote-data-tags

Expected Behavior

Disable one of the search boxes (no input). There should be only one input element.

Actual Behavior

There are two input elements, one of which is dysfunctional, and the user may use it.

[lenart]

I believe that's just how this component is supposed to work. The first input holds the values user selected, while the bottom one is used to filter the results - to make it easier to find the item you want to select/add to the list (in the first input).

[akhayyat]

The problem is: the first input box allows typing arbitrary input, and causes the dropdown to change as the input changes, which may seem like it's searching, but it's not. The dropdown changes in an unpredictable way.

I find this counter-intuitive. There is no use case for the first box to allow user input (typing). It should only show selected tags, and disallow typing.