I made this small dashboard and I wanted to test a dynamically updating “results table” at the end of the page.
I created these test lines to see how i can update it, but it seems to not update correctly. It shows two additional rows in the output table but it doesnt show any values. When printing out the df the correct values are shown.
It would be great if you can help me.
Cheers,
Mjst
button_berechnen = html.Div([
dbc.Row([
dcc.Input(
id="input_marge",
placeholder= 'marge in 1XX% i.e. 1.4'),
html.Button('Berechnen', id ='submit-marge', n_clicks = 0),
]),
])
#output tabelle
output_table = html.Div([
dash_table.DataTable(
id = 'output_table',
columns = [ {'name' : 'Index', 'id': "index"},
{'name' : 'Produkt', 'id':"produkt"},
{'name' : 'Ebay', 'id':"ebay"},
{'name' : 'Amazon', 'id':"amazon"},
{'name' : 'Real', 'id':"real"},
{'name' : 'Webshop', 'id':"webshop"}],
style_cell = {
'backgroundColor': 'rgb(50,50,50)',
'color': 'white'
},
editable = True
)
])
app.layout = dbc.Container([
button_berechnen,
output_table,
])
@app.callback(Output('output_table', 'data'),
Input('submit-marge', 'n_clicks'),
#Input('produkt_daten', 'data'),
State('input_marge', 'value'))
#berechnen des output tables
def rows_berechnen(n_clicks, marge):
if n_clicks >0 :
df_preise = pd.DataFrame(columns = {'Produkt', 'Ebay', 'Amazon', 'Real', 'Webshop'})
test = {'Produkt' : 'marge', 'Ebay': marge, 'Amazon': marge, 'Real': marge, 'Webshop': marge}
test2 = {'Produkt' : 'marge', 'Ebay': marge, 'Amazon': marge, 'Real': marge, 'Webshop': marge}
df_preise = df_preise.append(test, ignore_index=True)
df_preise = df_preise.append(test2, ignore_index=True)
print(df_preise)
df = df_preise.to_dict(orient ='records')
return df
raise PreventUpdate
if __name__ == '__main__':
app.run_server(debug=True)
2
Answers
Try setting
data=[]
in the layout when you define the data table. Sometimes Dash has an issue with properties that haven’t been explicitly set.Edit:
The problem was coming from the way
columns
was defined. I changed it to this, and it worked:Has anyone tried to have a dynamic table with user inputs for simple arithmetic?
4 = cell[1][1] ; 5 = cell [1][2] ; cell[1][1]+cell[1][2] = cell [1][3]