Persist dash DataTable after user adds rows and changes tab

Hi all,

I am making a multi tab app in which one tab displays a few user-editable DataTable’s. The user has to be able to add and delete rows. The inputs are then dynamically saved in a dcc.Store in the main script for future use in the computation of the model. I have managed to make the user selections persist when changing tabs as long as no rows are added or deleted. However, if the user adds or deletes rows whilst defining inputs, the data does not persist when returning to the tab. How can I make this happen?

Here is a sample of my code:

instr_types = (“N”, “O”, “P”)

arrays = (“Array”, “Double”)
df_vars = pd.DataFrame([
(‘Name’, “N”),
(‘Array/Double’, ‘Array’),
(‘Initial Value’, “0.00”)
])

layout = html.Div([
dcc.Store(id = “stored_variables”, storage_type=“session”), #actually in index.py
html.Div(html.H1(“Variables”)),
dash_table.DataTable(
id = ‘variables-table’,
data = df_vars.to_dict(‘records’),
columns = [
{“id” : “Name”, “name” : “Name”, “presentation” : “dropdown”},
{“id” : “Array/Double”, “name” : “Array/Double”, “presentation” : “dropdown”},
{“id” : “Initial Value”, “name” : “Initial Value”, “type” : “numeric”}
],
dropdown = {
“Name” : {
“options” : [
{ “label” : “g_{}”.format(i), “value” : “g_{}”.format(i)} for i in instr_types
] },
“Array/Double” : {
“options” : [
{ “label” : j, “value” : j} for j in arrays
]
}
},
editable=True,
row_deletable=True,
persistence = True,
persisted_props = [‘columns.name’, ‘data’, ‘filter_query’, ‘hidden_columns’, ‘page_current’, ‘selected_columns’, ‘selected_rows’, ‘sort_by’],
persistence_type = “session”
),
html.Div(id=‘variables-table-dropdown-container’),
html.Button(‘Add Row’, id=‘variables-addrows-button’, n_clicks=0)
])

@app.callback(Output(‘variables-table’, ‘data’),
Input(‘variables-addrows-button’, ‘n_clicks’),
State(‘variables-table’, ‘data’),
State(‘variables-table’, ‘columns’))
def add_row(n_clicks, rows, columns):
if n_clicks > 0:
rows.append({c[‘id’]: ‘’ for c in columns})
return rows

@app.callback(Output("stored_variables", "data"),
            Input('variables-table', 'data'))
def store_instruments(input_table):
    if input_table is None:
            raise PreventUpdate
    return pd.DataFrame(input_table).to_json(orient='split')

Many thanks.