Conditional rendering in st.form

Hi all!

I have a form where I need to use some conditional rendering. Basically, the form changes dynamically based on what the user input is. For instance, if I ask “Where did you hear about us?” and give the users some default options (e.g. “Linkedin”, “Our website”…), I want that if the user selects “Other” a st.text_input appears where the user can type the answer to the question.

The problem I am facing is that:

  • If I use st.form (with the st.submit_form_button), what happens is that the form does not dynamically adapt to the user’s input. So the text_field won’t show up at all when the user ticks “Other” in the example above.
  • If I do not use st.form, then the form reloads every time the user clicks on any widget. This does not affect the functionality of the form, but it does make for a very bad user experience!

Any tips on how I could either include conditional rendering within st.form or just avoid the bad user experience of the form being reloaded every time the user clicks on any widget?

Any help would be appreciated!

1 Like

Hi @tommaso-moro , you cant use Forms if you want to conditionally check for widget values within the form (as forms batch-submit inputs together).

You can, however, use read up about session states in the Streamlit docs, which will help you persist widget values despite reload. Here is the link: Session State - Streamlit Docs

Cheers

Hi @Shawn_Pereira ,

For the reason you pointed out, I have ditched st.form so that I can make interdependent widgets. I am using the Session State. However, while the values persist across page reloads, the page does reload every time the user clicks on a widget. This doesn’t impact the functionality of the form (because the values persist across page reloads) but it makes for a very bad user experience.

Do you have any tips on how the user experience can be improved?

Hi @tommaso-moro

I don’t think you can escape the page reload part as it is how Streamlit is designed to work. You could try other frameworks (like Flask, Justpy, etc.), or another programming language/tool, but you wont get the simplicity and ease of use that Streamlit offers you, and there will be a more investment of your time to perfect that learning.

Maybe, a Streamlit insider can opine (in case of any new developments)

Cheers

Try st.stop. You could collect input with reruns up to a certain point in your page, thus allowing widgets to be shown/hidden, and then allow the whole page to run based on your logic. Or, use a workflow (multi-tab) type of data input gathering. Or, implement the flexible data gathering form as a static HTML component.

HTH,
Arvindra

1 Like