ui.input_selectize

ui.input_selectize(
    id
    label
    choices
    *
    selected=None
    multiple=False
    width=None
    remove_button=None
    options=None
)

Create a select list that can be used to choose a single or multiple items from a list of values.

Parameters

id : str: An input id.
label : TagChild: An input label.
choices : SelectChoicesArg: Either a list of choices or a dictionary mapping choice values to labels. Note that if a dictionary is provided, the keys are used as the (input) values so that the dictionary values can hold HTML labels. A dictionary of dictionaries is also supported, and in that case, the top-level keys are treated as <optgroup> labels.
selected : Optional[str | list[str]] = None: The values that should be initially selected, if any.
multiple : bool = False: Is selection of multiple items allowed?
width : Optional[str] = None: The CSS width, e.g. ‘400px’, or ‘100%’
remove_button : Optional[bool] = None: Whether to add a remove button. This uses the clear_button and remove_button selectize plugins which can also be supplied as options. By default it will apply a remove button to multiple selections, but not single selections.
options : Optional[dict[str, Jsonifiable | JSEval]] = None: A dictionary of options. See the documentation of selectize.js for possible options. If you want to pass a JavaScript function, wrap the string in ui.JS.

Returns

: Tag: A UI element.

Notes

Server value

If multiple=False, the server value is a string with the value of the selected item. If multiple=True, the server value is a tuple containing the values of the selected items. When multiple=True and nothing is selected, this value will be None.

Examples

#| standalone: true
#| components: [editor, viewer]
#| layout: vertical
#| viewerHeight: 400

## file: app.py
from html import escape  # noqa: F401

from shiny import App, Inputs, Outputs, Session, render, ui

states = {
    "East Coast": {"NY": "New York", "NJ": "New Jersey", "CT": "Connecticut"},
    "West Coast": {"WA": "Washington", "OR": "Oregon", "CA": "California"},
    "Midwest": {"MN": "Minnesota", "WI": "Wisconsin", "IA": "Iowa"},
}

app_ui = ui.page_fluid(
    ui.input_selectize(
        "state",
        "Choose a state:",
        states,
        multiple=True,
    ),
    ui.output_text("value"),
    ui.input_selectize(
        "state2",
        "Selectize Options",
        states,
        multiple=True,
        options=(
            {
                "placeholder": "Enter text",
                "render": ui.js_eval(
                    '{option: function(item, escape) {return "<div><strong>Select " + escape(item.label) + "</strong></div>";}}'
                ),
                "create": True,
            }
        ),
    ),
    ui.input_selectize(
        "state3",
        "Selectize plugins",
        states,
        multiple=True,
        options={"plugins": ["clear_button"]},
    ),
)


def server(input: Inputs, output: Outputs, session: Session):
    @render.text
    def value():
        return "You choose: " + str(input.state())


app = App(app_ui, server)