Table of Contents

Description

...

Type	Usage	Image
Regular drop-down	When the user can only select one option from a predefined list. When there are fewer than 15 options.
Searchable drop-down	When there are more than 15 options. When users are expected to know what they are looking for, and are likely to be aware of how the option is labelled.
Multi-select drop-down	When the user can select multiple values from a predefined list
Multi-select searchable drop-down

Usage & Behavior

The drop-down consists of:

...

Interaction	Visual	Details
Click the trigger area		Clicking or tapping anywhere on the trigger area opens or closes the options list. The search field is focused and the user may start typing.
Enter Search		As characters are entered, the list is filtered to show matching results only. The filter can match anywhere within the value string (at the beginning, middle, or end). The part of the option label which matches the search string should be shown in bold. The user may use the Up and Down keys to navigate between options and Enter to select.
Select an option		The option label is added to the trigger area. The options list remains open, so the user can select another item. The selected options are checked.
Delete search string		A search string can be cleared using the X button, or manually by using the delete key. The full options list is presented. The search field is in focus.

Please refer to the Field validation page for more information.

A drop-down with a warning:

...