Warning: We no longer develop features for this version of SKY UX, and we recommend that you use the latest version instead. This site describes the AngularJS (1.x) implementation of the SKY UX framework. We still support this version, but it is in maintenance mode. For more information, see developer.blackbaud.com/skyux.

Select items from lists

To provide a consistent experience for users to select items from lists, follow these guidelines to determine which control to use to create a list.

Radio buttons

Use radio buttons when you have 2-5 options and users can only select one value.

HTML <select> field

Use an HTML <select> field when you have 6-20 values and users do not need to search for items.

Checkboxes

Use checkboxes when you have 2-5 values and users can select multiple values.

SKY UX select field

Use a SKY UX select field component when:

  • You have user-defined values that can accumulate and become too cumbersome for the other controls.
  • You have more than 5 values and users can select multiple values.
  • You have more than 20 values and users can only select one value.
  • You need to display items with titles and descriptions.