Trouble combining button and session state

First of all, thanks for a wonderful application. It is a joy to use.

I am trying to create a dynamical list which can be extended when you push a button (to build a pipeline in a later stadium). I accomplished this with the use of session state.

Each row of the list is outputted to the dashboard together with a button to remove this row, see figure and code:

screenhot|604x500

import streamlit as st

# Work around to store states across reruns
import SessionState

state = SessionState.get(rerun = False, prepro_steps=[])

if st.button('Add step'):
    state.prepro_steps += ['Step added {}'.format(len(state.prepro_steps))]

for i,c in enumerate(state.prepro_steps):
    if st.button('Remove step {}'.format(i)):
        state.prepro_steps.pop(i)

    st.text('Step {}: {}'.format(i, c))

st.write('len prepro = {}'.format(len(state.prepro_steps)))
st.write(state.prepro_steps)

However when I push a remove button something unwanted is happening: the code of the remove button is only activated when the rerun reaches the button again. So in my case the row below is removed because I use the position in the list (or the remove is postponed if you remove the last row).

You can see this behavior in the figure. Here I pressed the Add step button 4 times and then pressed the Remove step 2 button. In the rerun the for loop uses the intact list. On the third run of the loop, when reaching the third element of the list (second step), the row is first outputted to the dashboard before removing the third element (second step) of the list. The third step (fourth element) is not outputted because the for loop terminates because it has reached the length of the now shortened list. However outside the for loop the second element has been removed and the third element has become the second, as is outputted by the last two lines in the code. Thus the third element (second row) has been removed, however this is not outputted to the dashboard as I was expecting.

Does anybody have a solution or a workaround?

Hi @Duitel,

Welcome to the forum :wave:

I’ve modified your code to the following, seems to work well!

import streamlit as st

from collections import OrderedDict

# Work around to store states across reruns
import SessionState

state = SessionState.get(rerun = False, prepro_steps=OrderedDict())

if st.button('Add step'):
    try:
        next_key = next(reversed(state.prepro_steps)) + 1
    except StopIteration:
        next_key = 0

    state.prepro_steps[next_key] = 'Step added {}'.format(next_key)

for i,c in state.prepro_steps.copy().items():
    ph = st.empty()

    if ph.button('Remove step {}'.format(i)):
        state.prepro_steps.pop(i)
        ph = ph.empty()
    else:
        st.text('Step {}: {}'.format(i, c))

st.write('len prepro = {}'.format(len(state.prepro_steps)))
st.write(list(state.prepro_steps.values()))

Let us know if you have any further issues.

1 Like

Thanks for your reply, @Jonathan_Rhone. It works! The correct steps are shown! :muscle:

However, the remove button of the discarded step is still shown and clutters the dashboard without any functionality. Is it possible to remedy this?

Hey @Duitel,

I’m actually not seeing that behavior, the remove button is cleared along with the step for me.

Could you share your streamlit, python, browser, OS info?

Hi @Jonathan_Rhone,

The versions are:

Streamlit: 0.53.0
Python: 3.6.10
Browser1: 72.0.1 (64-bit) (Mozilla firefox for Ubuntu canonical - 1.0)
Browser2: Chromium Version 79.0.3945.130 (Official Build) snap (64-bit)
OS: Ubuntu 18.04.3 LTS

Hey @Duitel,

Could you send a video of the behavior? I’ve been using Quicktime screen recorder and uploading to Youtube.

Can you also verify that you’re running the updated script I sent over and not the original script you sent?

Thanks!

Hi @Jonathan_Rhone,

Your code works just fine!

Sorry to have wasted your time and once again many thanks for your solution.

One more question for the detectives out there (stop reading if you have something better to do):

I first tried @Jonathan_Rhone s code by making changes to mine, which somehow did not work. I just tried the code by copy pasting and it works just fine. I do not know what I did wrong the first time and that bothers me. I can not find the difference which causes the wrong behaviour, can you?

from collections import OrderedDict

# Work around to store states across reruns
import SessionState
state = SessionState.get(prepro_steps=OrderedDict())

if st.button('Add step'):
    try:
        next_key = next(reversed(state.prepro_steps)) + 1
    except StopIteration:
        next_key = 0

    state.prepro_steps[next_key] = 'Step added {}'.format(next_key)

for i,c in state.prepro_steps.copy().items():
    ph = st.empty()

    if st.button('Remove step {}'.format(i),'btn_rstep{}'.format(i)):
        state.prepro_steps.pop(i)
        ph = ph.empty()
    else:
        st.text('Step {}: {}'.format(i, c))
        st.text('\n')