Datatable: Update dataframes with submit button

Dash Python
6

I think you can use dash_ag_grid to make it. In this case I used cellValueChanged and rowData as State and then use n_clicks from Button as Input. Please take a look:

import dash_ag_grid as dag
from dash import Dash, html, dcc, Input, Output, State
import plotly.express as px
import pandas as pd

app = Dash(__name__)

df = pd.read_excel('https://github.com/hoatranobita/testttt/blob/main/df_thres.xlsx?raw=true')

app.layout = html.Div(
    [dbc.Button('Submit', size='sm', id='btn'),
        dcc.Markdown("Example of using `rowData` in a callback with an editable grid"),
        dag.AgGrid(
            id="editing-grid2",
            columnDefs=[{ 'field': 'Feature', 'editable': False},
                        { 'field': 'Threshold', 'editable': False},
                        { 'field': 'new_Threshold', 'editable': True}],
            rowData=df.to_dict("records"),
            columnSize="sizeToFit",
        ),
        html.Div(id="editing-grid-output2"),
    ],
    style={"margin": 20},
)


@app.callback(
    Output("editing-grid2", "rowData"),
    Input("btn", "n_clicks"),
    State("editing-grid2", "cellValueChanged"),
    State("editing-grid2", "rowData"))

def update(n_clicks, cel_Value, rows):
    dff = pd.DataFrame(rows)
    dff['new_Threshold'] = pd.to_numeric(dff['new_Threshold'])
    row = pd.to_numeric(cel_Value["rowId"])
    newValue = pd.to_numeric(cel_Value["newValue"])
    dff['new_Threshold'].loc[row] = newValue*10
    
    if n_clicks:
        return dff.to_dict("records")
    else: 
        return no_update

if __name__ == "__main__":
    app.run_server(debug=False)

Recording 2023-04-25 140051

3 Likes