2
 <ReactDataGrid
    columns={[
        { key: 'time', name: 'time', width: 140, formatter: (props) => (<span>{props.value}</span>), sortable: true },
        { key: 'Size', name: 'Size', width: 80, formatter: (props) => (<span>{props.value}</span>) },
        { key: 'qaw', name: 'dash Value', width: 350 },
    ]}
    rowGetter={this.rowGetter}
    rowsCount={list.length}
    emptyRowsView={() => (<div />)}
    rowSelection={{
        showCheckbox: true,
        onRowsSelected: this.onVersionRowsSelect,
        onRowsDeselected: this.onVersionRowsDeselect,
        selectBy: {
            indexes: this.state.selectedIndexes
        }
    }}
/>

Above is my code of react-data-grid. I want to disable row selection for particular row on some condition or want to disable checkbox for that specific row.

Please let me know how it can be achieved. Thanks

Pankwood
  • 1,799
  • 5
  • 24
  • 43
pareshm
  • 4,874
  • 5
  • 35
  • 53
  • @parashm were you able to find a proper method to achieve this ? I have a requirement where I want all the checkboxes disabled according to a condition. – Dante_97 Nov 17 '20 at 08:12
  • @Dante_97 still didn't find the proper way. – pareshm Nov 17 '20 at 11:00

1 Answers1

2

You can disable the selection of the row by doing the following:-

onVersionRowsSelect(rows) {
    rows = rows.filter(item => !item.row.isSnapshotQuarantined)
    this.setState({
        selectedIndexes: this.state.selectedIndexes.concat(rows.map(r => r.rowIdx))
    });
}

I am not sure if you can change the visual effect of disabling the checkbox as the checkbox html's control is not exposed by react-data-grid (as per my knowledge).

Hope this helps.

Shivratna Kumar
  • 1,311
  • 1
  • 8
  • 18