In [ ]:

import panel as pn

pn.extension()

The CrossSelector widget allows selecting multiple values from a list of options by moving items between two lists. It falls into the broad category of multi-option selection widgets that provide a compatible API and include the MultiSelect, CheckBoxGroup and CheckButtonGroup widgets.

For more information about listening to widget events and laying out widgets refer to the widgets user guide. Alternatively you can learn how to build GUIs by declaring parameters independently of any specific widgets in the param user guide. To express interactivity entirely using Javascript without the need for a Python server take a look at the links user guide.

Parameters:¶

For layout and styling related parameters see the customization user guide.

Core¶

definition_order (boolean, default=True): Whether to preserve definition order after filtering. Disable to allow the order of selection to define the order of the selected list.
filter_fn (function): The filter function applied when querying using the text fields, defaults to re.search. Function is two arguments, the query or pattern and the item label.
options (list or dict): List or dictionary of available options
value (boolean): Currently selected options

Display¶

disabled (boolean): Whether the widget is editable
name (str): The title of the widget

The CrossSelector is made up of a number of components:

Two lists for the unselected (left) and selected (right) option values
Filter boxes that allow using a regex to match options in the list of values below
Buttons to move values from the unselected to the selected list (>>) and vice versa (<<)

In [ ]:

cross_selector = pn.widgets.CrossSelector(name='Fruits', value=['Apple', 'Pear'], 
    options=['Apple', 'Banana', 'Pear', 'Strawberry'])

cross_selector

CrossSelector.value returns a list of the currently selected options:

In [ ]:

cross_selector.value