Can I add to. a selectbox an "other" option, where the user can add his own answer?

I want to add to a selectbox an ā€œotherā€ option, where the user can add his own answer, I canā€™t find how, who can help?
fyi - I did see this awesome streamlit-tags option, but itā€™s not what I want, I want a drop down list with the option to write your own optionā€¦

Hi @Efrat_Garber_Aran , you will need to add a textbox for the user to type in the option not already present in the selectbox.

If the textbox variable contains new text when your program is run, add it to the options of the selectbox; if not, the user can still select options from the selectbox.

Cheers

1 Like

Iā€™d condition a st.text_input to one of the possible options in the st.selectbox, like this:

selectbox

import streamlit as st

# Create selectbox
options = [f"Option #{i}" for i in range(3)] + ["Another option..."]
selection = st.selectbox("Select option", options=options)

# Create text input for user entry
if selection == "Another option...": 
    otherOption = st.text_input("Enter your other option...")

# Just to show the selected option
if selection != "Another option...":
    st.info(f":white_check_mark: The selected option is {selection} ")
else: 
    st.info(f":white_check_mark: The written option is {otherOption} ")
2 Likes

Is there a way to have this behavior also in st.form?

1 Like

Good question. Wrapping everything in a form will not work straight away because all components within a st.form will wait for the st.form_submit_button to be clicked (see st.form - Streamlit Docs).

However, you can abuse st.empty containers to bypass the form and achieve a similar behavior.

anotherOptionWithinForm

Code:

import streamlit as st

# Layout for the form 
with st.form("myform"):

    "### A form"

    # These exist within the form but won't wait for the submit button
    placeholder_for_selectbox = st.empty()
    placeholder_for_optional_text = st.empty()

    # Other components within the form will actually wait for the submit button
    radio_option = st.radio("Select number", [1, 2, 3], horizontal=True)
    submit_button = st.form_submit_button("Submit!")

# Create selectbox
with placeholder_for_selectbox:
    options = [f"Option #{i}" for i in range(3)] + ["Another option..."]
    selection = st.selectbox("Select option", options=options)

# Create text input for user entry
with placeholder_for_optional_text:
    if selection == "Another option...":
        otherOption = st.text_input("Enter your other option...")

# Code below is just to show the app behavior
with st.sidebar:

    "#### Notice that our `st.selectbox` doesn't really wait for `st.form_submit_button` to be clicked to update its value"
    st.warning(f"`st.selectbox` = *{selection}*")

    "#### But the other components within `st.form` do wait for `st.form_submit_button` to be clicked to update their value"
    st.info(f"`st.radio` = {radio_option}")

    "----"
    "#### It's better to condition the app flow to the form_submit_button... just in case"
    if submit_button:
        if selection != "Another option...":
            st.info(
                f":white_check_mark: The selected option is **{selection}** and the radio button is **{radio_option}**")
        else:
            st.info(
                f":white_check_mark: The written option is **{otherOption}** and the radio button is **{radio_option}** ")
    else:
        st.error("`st.form_submit_button` has not been clicked yet")
1 Like

Thatā€™s just exactly what I was looking for. Wonderful, thanks @edsaac!

1 Like

Is it possible to show an option in st.selectbox but have it disabled/greyed out??
I have drop-down where certain options are not included now but we plan to include them in future, so want to add them but disabled for now

Is it possible to make the select box return a variable that is not in the list of option?, I mean if I write to search an option, if that option is not present, add that option to the list, without having to type it in a text input box. Just like this answer, but in just one box:

Thanks

Hi @schancksb,

  1. You could probably try and see if this component ( New component: streamlit_datalist! - :jigsaw: Streamlit Components - Streamlit) works for you.
  2. Additionally, if it does, you can try to append the new item (after entry) to the session state list that populates the dropdown. Even if this does not work, you still will be able to enter elements not in the dropdown.

Cheers

1 Like

This topic was automatically closed 365 days after the last reply. New replies are no longer allowed.