Expected behavior of 'selected_row_ids' in dash_table.DataTable

Dash Python
1

What is the expected behavior of selected_row_ids in a dash_table.DataTable component? From the docs it says that it

contains the ids of rows that are selected via the UI elements that appear when row_selectable is 'single' or 'multi'

which suggests that I can set this property when instantiating the table so that it is rendered already with the specified rows selected. However, this is not the case as the following minimal working example shows:

from dash import Dash, dash_table
import pandas as pd

###### BEGIN DASH APP ########
app = Dash(__name__)

df = pd.DataFrame({'A': [1, 2, 3, 4], 'B': ['a', 'b', 'c', 'd']})
df['id'] = df.index


################## MAIN APP LAYOUT ##############
app.layout = dash_table.DataTable(
        data = df.to_dict('records'),
        columns= [
            {
                'name': column,
                'id': column
            } for column in df.columns
        ],
        row_selectable= 'multi',
        selected_row_ids= [0, 3]
)
    
################## MAIN APP CALLBACKS ##############
if __name__ == '__main__':
    
    app.run_server(debug = True)

That being said, the selected rows appear just fine if instead of the property selected_row_ids, the property selected_rows is specified. Even more, if you specify one of the two properties, the other one will be None even though I would expect that they both go hand by hand.

What is then the correct way to initialize the selected rows in a DataTable object via the row id (and NOT the row number)?

2

Hi @ernestqt and welcome to the Dash community :slight_smile:

I can verify that the selected_row_ids prop appears to be read-only in the DataTable.

Have you considered using Dash AG Grid instead? It’s possible to set the selected rows and and you can find an example in the docs here:

Plus more info on selected rows with Dash AG Grid in this post:

3

Thanks for the answer @AnnMarieW ! I am looking into AG grid and it looks promising. However, I haven’t figured out how to delete rows like in a dash datatable. Is this is possible at all?

4

Hi @ernestqt

Yes, it’s possible to delete selected rows Dash AG Grid like the DataTable. See this post:

1 Like