How to use row_selectable in dataTable without the radio button, just clicking on the row

Dash Python
1

Hi guys, I’m trying to make the row highlighted just by clicking anywhere in the row, but I can’t do this without using row_selectable which places a radio button in the table

dash_table.DataTable(
  id='data-table',
  columns=[
      {'name': i, 'id': i, 'editable': False} for i in summary.columns
  ],
  data=[],
  style_table={'overflowX': 'auto'},
  sort_action='native',  
  sort_mode='multi', 
  row_selectable='single',
  selected_rows=[],  
  page_size=10,
  style_data_conditional=[]
),

My callback:

    @dash_app.callback(
        Output('data-table', 'style_data_conditional'),
        [Input('data-table', 'selected_rows')]
    )
    def highlight_selected_row(selected_rows):
        if not selected_rows:
            return []
        return [
            {
                'if': {'row_index': i},
                'backgroundColor': 'rgba(0, 0, 0, 0.3)',
                'border': '1px solid black'
                } for i in selected_rows
        ]

How to do this without the radio buttons that row_selectable adds?

Thanks for the help!!

2

Hi @JackWtr

The DataTable requires the radio button for row selection. However this is possible using Dash AG Grid

2 Likes