Prevent unselecting a Select component item

Feature Requests
1

I am not sure if this behavior changed when the component was upgraded or I just never noticed it.

When you select an item in a single selection Select component, you can click the same item again to unselect it. This is contrary to the default behavior of every other select, aka dropdown, element on the web. It is typical that when you select an item you cannot unselect it, but must either select a new item or select a provided "empty" item to clear it.

Is there a way to prevent this unselect behavior? I want it to be impossible for it to be empty as is normal with a html dropdown.

2

Hey Bradly!

If the select has the required option set to true in the validation section, clicking the item in the list will not unselect it

1312×578 39.2 KB

You could also use this in conjunction with the "Show clear button" setting so that:

  • Value starts as either the default value or blank
  • User selects an option
  • User could hit the (X) to unselect an item
  • but NOT select an item on the list to unselect it
3

Ok that works to make sure there is always a selection.

1 Like
4

:wave: thanks for the feedback and raising this! We added an 'Allow option to be deselected' option to the Select component so you control preventing the unselect behavior. Let me know if you have any feedback or issues using that!

1 Like
5

Nice, that is a cleaner solution!

2 Likes