Deleting rows from customToolbarSelect

In discussing the original implementation of the customToolbarSelect property (#49), @gregnb gives the example of using customToolbarSelect and adding a DeleteIcon to the custom toolbar to continue supporting deleting rows. The example goes on to show a handleClick, but not actually the deleting of the rows.

Beyond either manually modifying the data as a property (which would reinitialize the table removing current filters/page number, or creating a ref and updating the state through that (using setTableData as is done in the selectRowsDelete method now and manually triggering the onRowsDelete) I can’t delete rows when customToolbarSelect is enabled

Expected Behavior

I should be able to delete rows when customToolbarSelect is selected

Current Behavior

I can’t delete rows when customToolbarSelect is selected

Steps to Reproduce (for bugs)

1. Enable customToolbarSelect
2. Try to delete rows

[matteo1976]

for delete row with customToolbarSelect i did like this… I have in my index a function
deleteUsers(rowsSelect)

inside I use rowSelect.data.map() in order to modify my original data and set new state this.setState({ mydata: new_data})

so when i use customToolbarSelect i just pass my function as props in my component

const options = {
     filterType: 'checkbox',
     customToolbarSelect: selectedRows => (
       <MyCustomToolbarSelect
         selectedRows={selectedRows}
         onRowsDelete={this.deleteUsers}
       />
     ),
   }

and inside my component i use like this:

handleClick = () => {
   //console.log('click!', this.props.selectedRows)
   // a user can do something with these selectedRow values

   this.props.onRowsDelete(this.props.selectedRows)

 }

[patorjk]

@krisgoks check out the examples folder in this repo. Here’s a codesandbox of the selectable rows example, which shows one way of handling row deletion:

https://codesandbox.io/s/muidatatables-custom-toolbar-hv5n9?file=/index.js