# Dynamic selectbox opitions based on the input of text\_input

**URL:** <https://discuss.streamlit.io/t/dynamic-selectbox-opitions-based-on-the-input-of-text-input/7590>\
**Category:** Using Streamlit\
**Created:** [November 30, 2020, 3:49pm UTC](https://discuss.streamlit.io/t/dynamic-selectbox-opitions-based-on-the-input-of-text-input/7590 "2020-11-30T15:49:15Z")\
**Posts on this page:** 9\
**Page:** 1

<div class="post-metadata">

**Author:** ![oltipreka](https://sea2.discourse-cdn.com/streamlit/user_avatar/discuss.streamlit.io/oltipreka/32/3643_2.png) [@oltipreka](https://discuss.streamlit.io/u/oltipreka)\
**Post date:** [November 30, 2020, 3:49pm UTC](https://discuss.streamlit.io/t/dynamic-selectbox-opitions-based-on-the-input-of-text-input/7590/1 "2020-11-30T15:49:15Z")

</div>

Hello everybody,

I was wondering whether is there any way to show a dynamic st.selectbox list based on the input of a object obtained previously by st.text\_input().

In other words, insert the input and the selectbot options in unique row by merging these two streamlit methods together.

Is there another way to do this with html code??

---

<div class="post-metadata">

**Author:** ![ash2shukla](https://sea2.discourse-cdn.com/streamlit/user_avatar/discuss.streamlit.io/ash2shukla/32/2521_2.png) [@ash2shukla](https://discuss.streamlit.io/u/ash2shukla)\
**Post date:** [December 1, 2020, 10:49am UTC](https://discuss.streamlit.io/t/dynamic-selectbox-opitions-based-on-the-input-of-text-input/7590/2 "2020-12-01T10:49:36Z")

</div>

Hi @oltipreka,

I think you can try doing something like this, take comma separated values of options and then feed its split to options.

```python
import streamlit as st

inputs = st.text_input("Give csv of inputs")

st.selectbox("Select Dynamic", options=[opt.strip() for opt in inputs.split()])

```

If you want to take the values one by one it will be a little more complex as it will require you to hold the state. This snippet should do the job.

```auto
import streamlit as st
from state import provide_state

@provide_state
def main(state):
    state.inputs = state.inputs or set()

    input_string = st.text_input("Give inputs")
    state.inputs.add(input_string)

    st.selectbox("Select Dynamic", options=list(state.inputs))

main()

```

This will work like this,

 ![snippet](https://global.discourse-cdn.com/streamlit/original/2X/1/1a64ed87748eae8d891a2458cdde4f2816da4c89.gif)  
Hope it helps !

PS. find @provide\_state here, [https://gist.github.com/ash2shukla/ff180d7fbe8ec3a0240f19f4452acde7](https://gist.github.com/ash2shukla/ff180d7fbe8ec3a0240f19f4452acde7)

---

<div class="post-metadata">

**Author:** ![oltipreka](https://sea2.discourse-cdn.com/streamlit/user_avatar/discuss.streamlit.io/oltipreka/32/3643_2.png) [@oltipreka](https://discuss.streamlit.io/u/oltipreka)\
**Post date:** [December 1, 2020, 3:19pm UTC](https://discuss.streamlit.io/t/dynamic-selectbox-opitions-based-on-the-input-of-text-input/7590/3 "2020-12-01T15:19:47Z")

</div>

Dear @ash2shukla,

First, thank you so much for your effort. What you have suggested is exactly what I have been using.  
**`However, I was looking to do the same thing but in only one box, instead of two.`**

Most probably, Streamlit does no provide something similar, though I was hopping in any existing hack 🙄 🙂 🙂.

Can any of @andfanilo @Adrien_Treuille @okld tell us something more about it?

---

<div class="post-metadata">

**Author:** ![andfanilo](https://sea2.discourse-cdn.com/streamlit/user_avatar/discuss.streamlit.io/andfanilo/32/1040_2.png) [@andfanilo](https://discuss.streamlit.io/u/andfanilo)\
**Post date:** [December 7, 2020, 12:27pm UTC](https://discuss.streamlit.io/t/dynamic-selectbox-opitions-based-on-the-input-of-text-input/7590/4 "2020-12-07T12:27:40Z")

</div>

Hi @oltipreka,

Staying in the realm of native Streamlit solutions, @ash2shukla’s solution is the closest you’ll get 🙂, maybe you can hide the text\_input in the sidebar or an expander to make it more “configuration box”, and the selectbox in the main container.

Otherwise you will need to build your own [Streamlit component](https://blog.streamlit.io/introducing-streamlit-components/) for this and customizing one of [baseui’s components](https://baseweb.design/components/input/), that looks like a great component to do!

Best,  
Fanilo

---

<div class="post-metadata">

**Author:** ![okld](https://sea2.discourse-cdn.com/streamlit/user_avatar/discuss.streamlit.io/okld/32/1829_2.png) [@okld](https://discuss.streamlit.io/u/okld)\
**Post date:** [December 7, 2020, 2:48pm UTC](https://discuss.streamlit.io/t/dynamic-selectbox-opitions-based-on-the-input-of-text-input/7590/5 "2020-12-07T14:48:18Z")

</div>

Hello @oltipreka,

As stated by @andfanilo, the only way to achieve what you want is to build your own streamlit component.

You cannot merge a text input and a selectbox natively, but you can at least put them in the same row.  
I’ve taken @ash2shukla’s code sample, and modified it accordingly.

I’ve also changed it to automatically select the last input in the selectbox:

```python
import streamlit as st
from state import provide_state

@provide_state
def main(state):
    state.inputs = state.inputs or set()

    c1, c2 = st.beta_columns([2, 1])

    input_string = c1.text_input("Input")
    state.inputs.add(input_string)

    # Get the last index of state.inputs if it's not empty
    last_index = len(state.inputs) - 1 if state.inputs else None

    # Automatically select the last input with last_index
    c2.selectbox("Input presets", options=list(state.inputs), index=last_index)

if __name__ == " __main__":
    main()

```

 ![image](https://global.discourse-cdn.com/streamlit/original/2X/b/b43fc9e2c5f7cd89da66732ae6615f8dbf024eac.png)

PS: @ash2shukla I like your provide\_state decorator, I may use it for an another alternative state implementation 😃

---

<div class="post-metadata">

**Author:** ![oltipreka](https://sea2.discourse-cdn.com/streamlit/user_avatar/discuss.streamlit.io/oltipreka/32/3643_2.png) [@oltipreka](https://discuss.streamlit.io/u/oltipreka)\
**Post date:** [December 7, 2020, 10:23pm UTC](https://discuss.streamlit.io/t/dynamic-selectbox-opitions-based-on-the-input-of-text-input/7590/6 "2020-12-07T22:23:45Z")

</div>

Thank you all for the valuable suggestions.  
Wonderful support from the Streamlit Team 😉 😉 😉 😉.

---

<div class="post-metadata">

**Author:** ![Mo-Official](https://sea2.discourse-cdn.com/streamlit/user_avatar/discuss.streamlit.io/mo-official/32/10377_2.png) [@Mo-Official](https://discuss.streamlit.io/u/Mo-Official)\
**Post date:** [September 7, 2021, 4:15pm UTC](https://discuss.streamlit.io/t/dynamic-selectbox-opitions-based-on-the-input-of-text-input/7590/7 "2021-09-07T16:15:09Z")

</div>

Hello,  
here is an alternative way to do it. If you are looking for a way to dynamically add/remove text fields

Demo:  
 ![Screen Recording 2021-09-07 at 18.01.34](https://global.discourse-cdn.com/streamlit/original/2X/e/edbc959d24123f8513b02ce9bcafedf03d4fad95.gif)

Code:

```auto
def main():
    # add the key choices_len to the session_state
    if not "choices_len" in st.session_state:
        st.session_state["choices_len"] = 0
    
    # c_up contains the form
    # c_down contains the add and remove buttons
    c_up = st.container()
    c_down = st.container()

    with c_up:
        with st.form("myForm"):
            c1 = st.container() # c1 contains choices
            c2 = st.container() # c2 contains submit button
            with c2:
                st.form_submit_button("submit")

    with c_down:
        col_l, _, col_r = st.columns((4,15,4))
        with col_l:
            if st.button("Add Choise"):
                st.session_state["choices_len"] += 1

        with col_r:
            if st.button("remove Choise") and st.session_state["choices_len"] > 1:
                st.session_state["choices_len"] -= 1
                st.session_state.pop(f'{st.session_state["choices_len"]}')

    for x in range(st.session_state["choices_len"]): # create many choices
        with c1:
            st.text_input("text", key=f"{x}")
    
    # reads values from the session_state using the key.
    # also doesn't return an option if the value is empty
    st.selectbox("myOptions", options=[
        st.session_state[f"{x}"]\
        for x in range(st.session_state["choices_len"])\
        if not st.session_state[f"{x}"] == ''])

```

---

<div class="post-metadata">

**Author:** ![Danielse](https://avatars.discourse-cdn.com/v4/letter/d/97f17d/32.png) [@Danielse](https://discuss.streamlit.io/u/Danielse)\
**Post date:** [October 1, 2021, 7:20am UTC](https://discuss.streamlit.io/t/dynamic-selectbox-opitions-based-on-the-input-of-text-input/7590/8 "2021-10-01T07:20:59Z")

</div>

Is state replaced by the new feature session\_state? Otherwise I would use some of these examples here in my own dashboard.

---

<div class="post-metadata">

**Author:** ![pheman](https://sea2.discourse-cdn.com/streamlit/user_avatar/discuss.streamlit.io/pheman/32/15764_2.png) [@pheman](https://discuss.streamlit.io/u/pheman)\
**Post date:** [June 1, 2022, 5:31am UTC](https://discuss.streamlit.io/t/dynamic-selectbox-opitions-based-on-the-input-of-text-input/7590/9 "2022-06-01T05:31:48Z")

</div>

Any updates about this discussion together with this [Dynamic options update for dropdown](https://discuss.streamlit.io/t/dynamic-options-update-for-dropdown/5223).

There is a good dropdown solution in Dash ( see [Dropdown | Dash for Python Documentation | Plotly](https://dash.plotly.com/dash-core-components/dropdown)). Hope Streamlit will fill the gap~