How to use select box to select the first item in the list

[Matthew_King]

Summary

select_box on_change requires a change, so selecting the first item (the default) in the list does not trigger the callback. So the user has to select something else first, then select back to the first item in the list.
How can I make it possible for the user to just simply select the first item in the list?

Steps to reproduce

Code snippet:

add code here

If applicable, please provide the steps we should take to reproduce the error or specified behavior.

Expected behavior:

Explain what you expect to happen when you run the code above.

Actual behavior:

Explain the undesired behavior or error you see when you run the code above.
If you’re seeing an error message, share the full contents of the error message here.

Debug info

• Streamlit version: (get it with $ streamlit version)
• Python version: (get it with $ python --version)
• Using Conda? PipEnv? PyEnv? Pex?
• OS version:
• Browser version:

Requirements file

Using Conda? PipEnv? PyEnv? Pex? Share the contents of your requirements file here.
Not sure what a requirements file is? Check out this doc and add a requirements file to your app.

Links

• Link to your GitHub repo:
• Link to your deployed app:

Additional information

If needed, add any other context about the problem here.

[Shawn_Pereira]

Hi @Matthew_King, here’s a simple solution: suppose your selectbox options are [‘a’, ‘b’, ‘c’]. Why not change them to [‘’, ‘a’, ‘b’, ‘c’]. That way, your selectbox will have a default blank when it first loads. And the user would need to choose your 2nd item, which you consider to be as your first.

Additionally, by doing this, you get to know that the user explicitly chose an option, and what is being seen in the selectbox on first load, is not what the streamlit widget naturally put out.

Hope this is understandable.

Cheers

[Matthew_King]

That is a workaround. But it still means the user cannot select the default value set by the index arg, because that is not a change. This seems very counter intuitive and I was wondering if I was missing something.

[mathcatsand]

I agree with @Shawn_Pereira and that’s how I usually handle this kind of case. Either default to an invalid choice so it’s forced, or default to a value with all the rest of the page consistent as if that default value had just been selected.

Would it work better for you to use a form and tie the action to a submit button? Or even to add a “confirm” button on the page without a form to have an intuitive way for the user to progress?

What event are you triggering in your callback that doesn’t align with the page loading with that default value already selected?

[Matthew_King]

Its the same nested lists flow we are talking about on the other thread. User selects from a list of Customers, which then determines a list of Orchards that they can pick from, which then determines a list of Blocks they can pick from. Same logic if it were selecting State, then City, then Block,

That they cannot select the default, and also I have to write a special case using a button instead of a selectbox if there happens to be only 1 element in the list, just seems off to me. It smells like I am missing something obvious.

[blackary]

It’s not fundamentally any different, but if it’s helpful, I built this mini component to make it easy to solve this exact issue https://extras.streamlit.app/No-Default%20Selectbox

[Shawn_Pereira]

Hi @blackary, the No-Default Selectbox seems to be better than the native Streamlit selectbox in terms of functionality. Is there a reason it is not within Streamlit, but a part of the extras?

Other widgets (such as the date widget) need to have this functionality. Date widgets need to default to a none / blank value, rather than the current date. Without this, non-mandatory date widgets in a data app become effectively useless.

Cheers

[blackary]

@Shawn_Pereira That’s a fair question. The best answer I can give is to suggest going and up-voting (and commenting on, if you’d like) this issue: st.selectbox - No selection per default · Issue #949 · streamlit/streamlit · GitHub Streamlit devs do pay attention to which issues get the most upvotes, and use that to consider what to prioritize building next.