Black Lives Matter. Please consider donating to Black Girls Code today.

Can't select equal rows in dash table experiment

Hello folks,

Using dash table experiment, I cant figure out why I cant select rows with identical column values???

See image below where I select all rows, and print out the row numbers. Rows 2-6 are not selected.

I am starting from the usage.py file on github here.
Here is my test code:

import dash
from dash.dependencies import Input, Output, State
import dash_core_components as dcc
import dash_html_components as html
import dash_table_experiments as dt
import json
import pandas as pd
import numpy as np
import plotly
import logging
app = dash.Dash()

app.scripts.config.serve_locally = True
app.config['suppress_callback_exceptions']=True

DF_GAPMINDER = pd.read_csv('randomtable.csv') # random data in a table with couple of rows that are 
#equal

app.layout = html.Div([
html.H4('SEARCH WINDING & PERFORMANCE CURVES WEBPAGE'),
dt.DataTable(
    rows=DF_GAPMINDER.to_dict('records'),

    # optional - sets the order of columns
    columns=sorted(DF_GAPMINDER.columns),

    row_selectable=True,
    filterable=True,
    sortable=True,
    selected_row_indices=[],
    id='datatable-gapminder'
),
html.Div(id='selected-indexes'),

 ], className="container")

###########################################
##callback to get selected row indices#####
###########################################

@app.callback(
Output('datatable-gapminder', 'selected_row_indices'),
[Input('datatable-gapminder', 'clickData')],
[State('datatable-gapminder', 'selected_row_indices')])

def update_selected_row_indices(clickData, selected_row_indices):
if clickData:
    for point in clickData['points']:
        if point['pointNumber'] in selected_row_indices:
            selected_row_indices.remove(point['pointNumber'])
        else:
            selected_row_indices.append(point['pointNumber'])
return selected_row_indices

#################################################
###Callback to update indices row display########
#################################################

@app.callback(
Output('selected-indexes', 'children'),
[Input('datatable-gapminder', 'selected_row_indices')])

def update_indices(selected_row_indices):
return 'Selected row indices: "{}" '.format(selected_row_indices)

app.css.append_css({
'external_url': 'https://codepen.io/alitarraf/pen/bvxdOY.css'
})

if __name__ == '__main__':
app.run_server()

Yeah, that’s pretty annoying. There was another topic on this but I can’t seem to find it. The current workaround is to add a new column that contains the index of the data, but then hide that column by excluding it from the columns property. It’ll still be part of the data (and therefore won’t be identified as a duplicate row) but it won’t actually be displayed.

Thanks for the suggestion, I will try that with pandas in the code. I love how the table component is coming together! Great work!

1 Like