Select

The Select component allows the user to select an entry in a droplist.

A full example setup on Select is available in our Showroom. You can view a demo, as well as access the setup in Appfarm Create. If you do not have access, you may register on Showroom Signup.

Properties

Selection Type

The Select component has two types - Basic and Property.

  • Property allows the user to choose an entry from a list of options, and the option selected is stored in a property or variable (defined by the Value setting). Example: A droplist where you select the Department for a Project. The options are the Departments, and the value to be set it the Project.Department reference.

  • Basic allows the user to choose an entry from a list of options, and when an entry is selected, that entry is marked as selected in the data source holding the options. Example: A data source Projects holds all project you have access to. When selecting a Project in the list, that project is marked as selected. This is useful when you have a UI that displays information about the selected Project, and for example if you have a Tasks data source that is filtered towards the selected Project.

Differences between these selection types are illustrated in the Showroom.

Options

This is available for Basic type only. This allows the user to select the Data Source that holds the options which the user can choose from.

Display Value

This is available for Basic type only. Select the property of the Data Source used in Options that should be displayed to the user.

Value

This is available for Property type only. This is where the property to connect to the Select is chosen. For instance, selecting Order.Category here will display a list of all available Categories. Choosing an option will assign the Category property to the appropriate Order object.

Filter

This is available for Basic type only. If you do not want all entries of the Data Source to be selectable, you may apply a filter here to limit the rows of the Select.

Conditional Filter

This is available for Basic type only. In addition to the Filter property, you may also choose to have a dynamic filter on the Data Source, applied given certain conditions.

Conditional Options

This is available for Property type only. This allows you to define conditions, and which options are available to the user in each of those conditions. The first condition that evaluates to true will be used. All properties will be available for selection if no conditions are defined, or if they all evaluate to false.

Sorting

This is available for Basic type only. This allows you to select a property to sort by, which will affect the order in which options will appear to the user.

Allow Null

This is available for Property type only. This will insert a clear value into the list of options, to allow the user to clear the selection.

It is recommended to use a Placeholder for this so that the meaning of this blank value is properly communicated to the user.

Autocomplete

This is available for both Select types. If the list of options is long, you should consider checking this setting. It allows for searching the options of the Select.

Error

This is available for both Select types. Here you can select a value to assign an error state to the component.

Last updated