Add a line item or row

🎈 Using Streamlit
1

stre
stre1856×649 16.9 KB

Hi,
This is my first day of streamlit.
I have few columns, once I click on add button I should be able to add new row/line
exmples:
i have columns
product,unit,quantity,price and a add button as soon as I clicked on add button I should get a new line or row where I could enter another details.

code:

image
image1920×1018 121 KB

If I get similar to the below screenshot then also great

image
image1006×240 3.19 KB

I understand my codes aren’t that useful, So I will accept any suggestion to make this feasible

Thanks.

2

Hi there,

Thanks for sharing your question with the community! Check out our guidelines on how to post an effective question here – in particular, please share a code snippet so we can make helpful suggestions.

3

Hi Caroline , I have edited my query. Please suggest a method

4

I have a related example here. (Instead of a button to add one, it uses a slider to set the number of rows but the Streamlit mechanics are the same.) The example has the forth column being computed from other columns as an additional feature.

https://mathcatsand-examples.streamlit.app/add_data

image
image810×744 18.8 KB 

import streamlit as st

st.write('# Solution using input widgets')

# a selection for the user to specify the number of rows
num_rows = st.slider('Number of rows', min_value=1, max_value=10)

# columns to lay out the inputs
grid = st.columns(4)

# Function to create a row of widgets (with row number input to assure unique keys)
def add_row(row):
    with grid[0]:
        st.text_input('col1', key=f'input_col1{row}')
    with grid[1]:
        st.number_input('col2', step=1, key=f'input_col2{row}')
    with grid[2]:
        st.number_input('col3', step=1, key=f'input_col3{row}')
    with grid[3]:
        st.number_input('col4', step=1, key=f'input_col4{row}',
                        value = st.session_state[f'input_col2{row}'] \
                            -st.session_state[f'input_col3{row}'],
                        disabled=True)

# Loop to create rows of input widgets
for r in range(num_rows):
    add_row(r)
1 Like
5

Hi Thanks for the solution.
Could you please let me know how didyou store the values of these columns.
or if u can share the code

6

Each widget’s value can be accessed by its key through st.session_state. So ‘col1’ in the first row could be accessed from st.session_state['input_col10'] where the 0 on the end is the index of the first row.

If you look at the other two examples, you can see each row being added to a data source, rather than left on the screen as a widget. In general, I recommend the dataframe implementation, which is the first tab that loads when you go to that page. (I’m just in the middle of editing the example so col1, col2, col3, and col4 have become name, income, expense, and net, respectively.

import streamlit as st
import pandas as pd

st.write('# Solution using a dataframe')

# Create an empty dataframe on first page load, will skip on page reloads
if 'data' not in st.session_state:
    data = pd.DataFrame({'name':[],'income':[],'expense':[],'net':[]})
    st.session_state.data = data

# Show current data
st.dataframe(st.session_state.data)

st.write('#### Using form submission')

# Function to append inputs from form into dataframe
def add_dfForm():
    row = pd.DataFrame({'name':[st.session_state.input_df_form_name],
            'income':[st.session_state.input_df_form_income],
            'expense':[st.session_state.input_df_form_expense],
            'net':[st.session_state.input_df_form_income-st.session_state.input_df_form_expense]})
    st.session_state.data = pd.concat([st.session_state.data, row])

# Inputs listed within a form
dfForm = st.form(key='dfForm', clear_on_submit=True)
with dfForm:
    dfFormColumns = st.columns(4)
    with dfFormColumns[0]:
        st.text_input('name', key='input_df_form_name')
    with dfFormColumns[1]:
        st.number_input('income', step=1, key='input_df_form_income')
    with dfFormColumns[2]:
        st.number_input('expense', step=1, key='input_df_form_expense')
    with dfFormColumns[3]:
        pass
    st.form_submit_button(on_click=add_dfForm)

st.write('#### Not using form submission')

# Function to append non-form inputs into dataframe
def add_df():
    row = pd.DataFrame({'name':[st.session_state.input_df_name],
            'income':[st.session_state.input_df_income],
            'expense':[st.session_state.input_df_expense],
            'net':[st.session_state.input_df_income-st.session_state.input_df_expense]})
    st.session_state.data = pd.concat([st.session_state.data, row])

# Inputs created outside of a form (allows computing net for preview)
dfColumns = st.columns(4)
with dfColumns[0]:
    st.text_input('name', key='input_df_name')
with dfColumns[1]:
    st.number_input('income', step=1, key='input_df_income')
with dfColumns[2]:
    st.number_input('expense', step=1, key='input_df_expense')
with dfColumns[3]:
    st.number_input('net', step=1, key='input_df_net', 
                    value = st.session_state.input_df_income-st.session_state.input_df_expense, 
                    disabled=True)
st.button('Submit', on_click=add_df)
7

Thanyou [mathcatsand],
Saved a lot of time as well as learned from you.

1 Like