Allow user to add any number of elements to a page

🎈 Using Streamlit
1

I am building a project where I want my users to be able to dynamically add more elements to a page using a couple of parameters from input forms every time they hit submit. I am having trouble doing this where every time the user hits submit the element is overwritten and not added. I do not know how many elements they will add at the start. What’s the best way to do this?

2

Hi @okaheelp,

Can you share the code you’ve already written to try to implement this so we can point you in the right direction?

2 Likes
3

Of course @Caroline . I’ve tried a couple of different things. Ideally I want it to be a form type input then the user would hit submit and it would add the elements that are inputed to the page and they can do this multiple times to allow multiple things to be added.

I’ve tried a couple of things but the closest I got was

container = st.container()
form = st.form("my_form")
title = form.text_input('Movie title', 'Life of Brian')
submitted = form.form_submit_button("Submit")

if submitted:
    container.write('The current movie title is {}'.format(title))
    submitted = False

but in this case if you modify the text in the form then hit submit a second time it ends up overwriting what exists already

4

I’d use the session state to store the new elements as they are submitted.

st_sessionstate

Code:

import streamlit as st
if "history_list" not in st.session_state.keys():
    st.session_state.history_list = list()

cols = st.columns(2)
with cols[0]:
    current_placeholder = st.container()
with cols[1]:
    history_placeholder = st.container()

with st.form("my_form"):
    title = st.text_input('Movie title', 'Life of Brian')
    
    if st.form_submit_button("Submit"):
        with current_placeholder:
            st.write(f'The current movie title is **{title}**')
        with history_placeholder:
            st.session_state.history_list.append(title)
            history_placeholder.write(st.session_state.history_list)
1 Like
5

My apologies for being obtuse and annoying @edsaac . I can’t exactly do that. For each input, I’m generating an interactive artifact that uses the info in the form. So let’s say for each of those movies added, I’m fetching review data then displaying an interactive graph of that historic data at the end of the page. The graph would be overwritten every time, I tried counteracting it with containers but I would have to know how many movies the user would add before generating it

6

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