Update datatable from callback based on modal popup

Dash Python
1

In my dash application, I have a form in modal popup that accepts input from user. I’d like to use select fields from modal popup, listen for their values in callback and then when user submits the form or saves, I’d like to add a row to the database.

I have the code to add new row to the database down. Here’s the behavior:

Click button to add new row > Open Popup > Save form > Populate new row based on values from form input.

My questions is how do I update a single row of dash datatable based on values from modal popup?

# Update DataTable
@app.callback(Output("comps-table", "data"),
              [
                  # Modal Popup
                  Input("prop-type-2","value"),
                  Input("sqft","value"),
                  Input("Renovated","value"),
                  Input("Floor","value"),
                  Input("prop-class","value"),
                  Input("Built","value"),
                  Input("rent-ask-2","value")


                  # Buttons
                  Input("comps-button", "n_clicks"),
                  Input("add-prop-btn", "n_clicks"),
                  Input("save", "n_clicks")
              ],
              [
                  State("comps-table", "data"),
                  State("comps-table", "columns")
              ]
             )
def update_table(address, proptype, dealtype, space, floor, rent, leasetype, ameneties, n_clicks, n_clicks1, nclicks2, rows, columns):

    # Add new row
    if n_clicks1:

        rows.append({c['id']: '' for c in columns})

        return rows

    # update new row
    elif nclicks2:

        return rows

    # Run func
    elif n_clicks:
2

Same problem. Does anybody know the solution?

3

@baller1 Here’s how I did it:

# Add new row
    if n_clicks:

        rows.append({c['id']: '' for c in columns})

        # Assign values to appended rows
        for k,v in rows[-1].items():

            if k == 'column1':

                rows[-1][k] = val1

            elif k == 'col2':

                rows[-1][k] = val2

            elif k == 'col3':

                rows[-1][k] = val3

        return rows