Skip to content

Collect user input with a searchable list of choices, by using the dropdown cell type.

The dropdown cell type lets users select a value from a predefined list. It is a simplified version of autocomplete with strict mode always on.

Overview

The dropdown cell type is based on an autocomplete cell type and can also be searchable.

Usage

This example shows the usage of the dropdown feature. Dropdown is based on Autocomplete cell type. All options used by autocomplete cell type apply to dropdown as well.

The source option

The source option can be provided in two formats:

Array of values

You can provide the source option as an array of values that will be used as the dropdown options.

Array of objects

You can provide the source option as an array of objects with key and value properties. The value property will be used as the dropdown option, while the entire object will be used as the value of the cell.

API methods

When working with object-based dropdown data, you can use methods like getSourceData(), getSourceDataAtCell(), getSourceDataAtRow() etc., to get the data in its original object format with both key and value properties. The getData() method will return only the value property’s content.

Result

After configuring the dropdown cell type, cells display a button that opens a dropdown list of options. Users can search the list by typing. Only values from the source list are accepted. The selected value is stored in the data source.

Related guides

Configuration options

Core methods

Hooks