Highlight cell in DataTable if it has been edited

Dash Python
1

So I basically have an editable datatable with a loaded excel file where I want to highlight cells where a value has been changed compared to the “source” excel file.

dash_table.DataTable(
            id='mapping-rules-table',
            columns=[{"name": i, "id": i} for i in applied_mapping_rules.columns],
            data=applied_mapping_rules.to_dict('records'),
            editable=True),

Is there any easy way to do this?

2

Seems like this should be possible. Based on the online help for dash.DataTable, it seems like a callback similar to the following could be constructed.

@app.callback(
    Output('mapping-rules-table', 'style_data_conditional'),
    [Input('mapping-rules-table', 'data_timestamp')],
    [State('mapping-rules-table', 'data'),
     State('some-datastore-with-orig-data','data')]
)
def compare_table_to_orig(ts, data, orig_data):
    # callback input is timestamp so inputs and outputs won't be the same

    # Compare datatables

    # Create style data conditional to highlight those
    # cells that differ from the orig
3

If your table isn’t too big and you’re willing to duplicate all the data you might even be able to do it without callbacks - make a hidden copy of every editable column, and create an entry in style_data_conditional for each column comparing it to the hidden one
(actually, just tested this, you don’t even need to make actual columns for these and then hide them, just having the keys in data is enough)

data=applied_mapping_rules.to_dict('records')
for row in data:
    row.update({i + '_hidden' : v for i, v in row.items()})

dash_table.DataTable(
    id='mapping-rules-table',
    columns=(
        [{"name": i, "id": i} for i in applied_mapping_rules.columns]
    ),
    data=data,
    editable=True,
    style_data_conditional=[{
      'if': {
        'column_id': i,
        'filter_query': '{{{0}}} != {{{0}_hidden}}'.format(i)
      },
      'background_color': 'red'  # or whatever
    } for i in applied_mapping_rules.columns]
)
2 Likes