CODEWITHSUNDEEP
python-3.xweb-applicationsform-submitstreamlit
Nabi Shaikh
Nabi Shaikh

Reputation: 851

Unable to keep the the output of Multiple form in same page in Streamlit app

Image1

As one can observe in the above image , we have form1 f1 and form2 f2 . here i am trying to display the output of both the form . But when i enter submit button for form1 output of form2 disappears and similarly after entering the form2 button form1 output is getting disappear. i am curious about this .because both the submitt button are different.

Code

    import streamlit as st



def main():
    st.title("streamlit Forms & Submit Demo")

    my_form = st.form(key = "form1")
    name = my_form.text_input(label = "Enter the model name")
    number = my_form.slider("Enter your age", min_value=10, max_value = 100 )
    submit = my_form.form_submit_button(label = "Submit this form")
    if submit:
        st.markdown(
            f"""
                            * Select Name : {name}
                            * Select Number : {number}
                            """
        )

    col1, col2 = st.beta_columns(2)

    with col1:

        with st.form('Form2'):
            f1_selectflavor=st.selectbox('Select flavor', ['Vanilla', 'Chocolate'], key=1)
            f1_selectintensity=st.slider(label='Select intensity', min_value=0, max_value=100, key=4)
            submitted1 = st.form_submit_button('Submit 1')
            if submitted1:
                st.markdown(
                    f"""
                    * Select Flavor : {f1_selectflavor}
                    * Select Intensity : {f1_selectintensity}
                    """
                )


    with col2:
        with st.form('Form3'):
            f2_selecttopping=st.selectbox('Select Topping', ['Almonds', 'Sprinkles'], key=2)
            f2_selectintensity=st.slider(label='Select Intensity', min_value=0, max_value=100, key=3)
            submitted2 = st.form_submit_button('Submit 2')
            if submitted2:
                st.markdown(
                    f"""
                    * Select Toppings : {f2_selecttopping}
                    * Select Intensity : {f2_selectintensity}
                    """
                )

    st.text(number)

    st.markdown("Columns inside form")

    with st.form(key='columns_in_form'):
        cols = st.beta_columns(5)
        for i, col in enumerate(cols):
            col.selectbox(f'Make a Selection', ['click', 'or click'], key=i)
        submitted = st.form_submit_button('Submit')



if __name__ == '__main__':
    main()

Upvotes: 3

Views: 3344

Answers (1)

Yee.
Yee.

Reputation: 90

I had the same issue, but I managed to find a way around it by wrapping the codes that you the button to trigger into a function and pass the function as an argument to form_submit_button using on_click.

def trigger():
   st.markdown(
     f"""
      * Select Toppings : {f2_selecttopping}
      * Select Intensity : {f2_selectintensity}
      """)
 
submitted2 = st.form_submit_button('Submit 2', on_click=trigger)

vice versa for other forms.

Upvotes: 2

Related Questions