Dash datable styling money

Dash Python
1

Hi back here with another problem, I’m creating a big dashboard which reads from an sql server a csv file and has different outputs. I create a dash datable that’s filtered by some values which gets created correctly, now I’m trying to style it. I was able to add some color on the cells but now I’m stuck trying to change a value to money. Simply what I need is to change normal values like 100, 240 to 100$ 240$ on my output.
Here’s a litlle version of my code omitting the parts like loading data and others:
‘’’
html.Div([
dash_table.DataTable(

        id='Worst_stations_table',
        style_cell={'textAlign': 'left'},
        style_data_conditional=[{'if': {'column_id': 'Cost Benefit ',
                                        'filter_query': '{Cost Benefit } > 0', },
                                 'backgroundColor': '#3D9970',
                                 'color': 'white'}, ],

    )
], className='three columns'),

])
@app.callback(
[Output(‘Worst_stations_table’,‘data’),Output(‘Worst_stations_table’, ‘columns’)],
[Input(‘Week-choose’,‘value’)]
)

def update_value(Weeekee):
Worst_stations_table = Hyper_filtered[(Hyper_filtered[‘Cost Benefit’] < 200)]
Columns_worst_stations = [‘Station’, ‘Cost Benefit’, ‘Week’]
Worst_stations_table = Worst_stations_table[Columns_worst_stations]

Worst_station_filtered_week= Worst_stations_table[Worst_stations_table['Week']== Weeekee]

Worst_station_filtered_week_columns = ['Station', 'Cost Benefit']

Worst_station_filtered_week_columns=Worst_station_filtered_week[Worst_station_filtered_week_columns]
Worst_station_filtered_week_columns= Worst_station_filtered_week_columns.sort_values(by='Cost Benefit')

columns= [{'name': i, 'id': i} for i in Worst_station_filtered_week_columns.columns]

data= Worst_station_filtered_week_columns.to_dict('rows')


return  data, columns

‘’’
with this part I’m able to highlight the values I want now I just need to style them. I know that the callback is as messy as it gets but is working correctly and I’m gonna perfect it later.

Thanks

2

I tried something like this
style_data_conditional=[{‘if’: {‘column_id’: 'Cost Benefit ',
‘filter_query’: ‘{Cost Benefit } > 0’, },
‘backgroundColor’: ‘#3D9970’,
‘color’: ‘white’}, {‘if’: {‘column_id’: 'Cost Benefit ',
},
‘format’: FormatTemplate.money(0),
}],

But it’s not working either

3

Hi @sercotel! Have you tried working with dash_table.FormatTemplate?

So at the beginning of your app, you’d have

import dash_table.FormatTemplate

Then you’d change this line in your callback:

columns= [{'name': i, 'id': i, 'format': FormatTemplate.money()} for i in Worst_station_filtered_week_columns.columns]
4

Hi @shammamah your version is not working on my computer for some reason maybe because my first column is a str and the other one a numeric value, something like this:
country cost benefit
aaa 1000
bbb 500

I managed a working solution based on your input which works like this on the callback:
‘’’
columns=[{‘id’:‘Station’,‘name’:‘Station’,‘type’:‘text’},{‘id’:‘Cost Benefit’,‘name’:‘Cost Benefit’,‘type’:‘numeric’,‘format’:FormatTemplate.money(1)}]
‘’’
But this works by outputting all the columns names. It works but maybe there’s another solution?

Thanks!

5

In that case, you could use a second conditional with only the name of the column of interest:

columns= [{'name': i, 'id': i} for i in Worst_station_filtered_week_columns.columns]

for column in columns: 
  if column['id'] == 'Cost Benefit': 
      column['format'] = FormatTemplate.money(1)