[Dash DataTable] Conditionally customise row colour by input

Dash Python
1

Hi ,
I am tring to highlight rows by input
The table looks like

image
image1028×510 69.2 KB

Where users are allowed to select ‘bid_qty’ via a dropdown box. In the caseabove, ‘bid_qty’ is 87.
In another word, ‘bid_qty’ is an input variable for the table.

Users can also select other ‘bid_qty’ such as 26 or 4 from dropdown box.
If a user seIelect 4 in ‘bid_qty’ box , I want to highlight the selected row accordingly

image
image1036×526 72.1 KB

I read the documentation and I knew I can hard-code the style, like


@app.callback(Output(...)
             [Input('bid_qty_dropdown', 'value')]

def update_table(selected_qty)
   ...
     style = (
              [{'if': {'filter_query': '{bid_qty} = "87"'}, 'backgroundColor': 'RebeccaPurple','color': 'black'}] 
              )

The code above only applies when ‘bid_qty’ == 87.

I tried

     style = (
              [{'if': {'filter_query': '{bid_qty} = selected_qty'}, 'backgroundColor': 'RebeccaPurple','color': 'black'}] 
              )

However that doesnt work .

Can someone help ? Thanks

2

Hi,

I think you just want something like:

@app.callback(
    Output(...)
    [Input('bid_qty_dropdown', 'value')]
)
def update_style(bid_qty_value, ...):
    ...
     style = (
              [{'if': {'filter_query': f'{{bid_qty}} = "{bid_qty_value}"'}, 'backgroundColor': 'RebeccaPurple','color': 'black'}] 
              )

This of course assumes that your python version support f-strings (it can be done with format otherwise). Note the double brakets to escape {} in the query.

1 Like
3

Thank you!
Works like a charm

1 Like