AutocompleteInput.ipynb

Kernel: Unknown Kernel

import panel as pn
pn.extension()

The AutocompleteInput widget allows selecting a value from a list or dictionary of options by entering the value into an auto-completing text field. It falls into the broad category of single-value, option-selection widgets that provide a compatible API and include the RadioBoxGroup, Select and DiscreteSlider widgets.

Discover more on using widgets to add interactivity to your applications in the how-to guides on interactivity. Alternatively, learn how to set up callbacks and (JS-)links between parameters or how to use them as part of declarative UIs with Param.

Parameters:

For details on other options for customizing the component see the layout and styling how-to guides.

Core

• options (list or dict): A list or dictionary of options to select from

• restrict (boolean, default=True): Set to False in order to allow users to enter text that is not present in the options list.

• search_strategy (str): Define how to search the list of completion strings. The default option "starts_with" means that the user's text must match the start of a completion string. Using "includes" means that the user's text can match any substring of a completion string.

• value (str): The current value updated when pressing key; must be one of the option values if restrict=True.

• value_input (str): The current value updated on every key press.

• case_sensitive (boolean, default=True): Enable or disable case sensitivity for matching completions.

Display

• disabled (boolean): Whether the widget is editable

• name (str): The title of the widget

• placeholder (str): A placeholder string displayed when no option is selected

• min_characters (int, default=2): The number of characters a user must type before completions are presented.

---

autocomplete = pn.widgets.AutocompleteInput(
    name='Autocomplete Input', options=['Biology', 'Chemistry', 'Physics'],
    case_sensitive=False, search_strategy='includes',
    placeholder='Write something here')

pn.Row(autocomplete, height=100)

Like most other widgets, AutocompleteInput has a value parameter that can be accessed or set:

autocomplete.value

If restrict=False the AutocompleteInput will allow any input in addition to the completions it offers:

not_restricted = autocomplete.clone(value='Mathematics', restrict=False)
pn.Row(not_restricted, height=100)

not_restricted.value

The options parameter also accepts a dictionary whose keys are going to be the labels of the dropdown menu.

dict_autocomplete = pn.widgets.AutocompleteInput(name='Autocomplete', options={'Biology': 1, 'Chemistry': 2})

pn.Row(dict_autocomplete, height=100)

dict_autocomplete.value

Updating the value will display the right label.

dict_autocomplete.value = 2

Controls

The AutocompleteInput widget exposes a number of options which can be changed from both Python and Javascript. Try out the effect of these parameters interactively:

pn.Row(autocomplete.controls(jslink=True), autocomplete)