Material-table: Exception on editing or deleting with multiple row selection enabled

[jurcaua]

Describe the bug
Cannot edit or delete any items when selection is enabled.

This is because an array is passed into this function but the function expect a single row object:

function changeRowEditing(rowData, mode) {
      if (rowData) {
        rowData.tableData.editing = mode;

        if (this.lastEditingRow && this.lastEditingRow != rowData) {
          this.lastEditingRow.tableData.editing = undefined;
        }

        if (mode) {
          this.lastEditingRow = rowData;
        } else {
          this.lastEditingRow = undefined;
        }
      } else if (this.lastEditingRow) {
        this.lastEditingRow.tableData.editing = undefined;
        this.lastEditingRow = undefined;
      }

To Reproduce
Steps to reproduce the behavior:

1. Create a table with option "selection" set to true.
2. Provide a edit and delete action (like in: https://material-table.com/#/docs/features/editable).
3. Select any number of rows.
4. Click either the edit or delete action button in the top right.
5. See exception below.

Expected behavior
Should be able to edit or delete the row(s).

Callstack

Uncaught TypeError: Cannot set property 'editing' of undefined
    at DataManager.changeRowEditing (data-manager.js:400)
    at Object.onClick (material-table.js:472)
    at handleOnClick (m-table-action.js:60)
    at onClick (m-table-action.js:69)
    at HTMLUnknownElement.callCallback (react-dom.development.js:149)
    at Object.invokeGuardedCallbackDev (react-dom.development.js:199)
    at invokeGuardedCallback (react-dom.development.js:256)
    at invokeGuardedCallbackAndCatchFirstError (react-dom.development.js:270)
    at executeDispatch (react-dom.development.js:561)
    at executeDispatchesInOrder (react-dom.development.js:583)
    at executeDispatchesAndRelease (react-dom.development.js:680)
    at executeDispatchesAndReleaseTopLevel (react-dom.development.js:688)
    at forEachAccumulated (react-dom.development.js:662)
    at runEventsInBatch (react-dom.development.js:816)
    at runExtractedEventsInBatch (react-dom.development.js:824)
    at handleTopLevel (react-dom.development.js:4826)
    at batchedUpdates$1 (react-dom.development.js:20439)
    at batchedUpdates (react-dom.development.js:2151)
    at dispatchEvent (react-dom.development.js:4905)
    at react-dom.development.js:20490
    at Object.unstable_runWithPriority (scheduler.development.js:255)
    at interactiveUpdates$1 (react-dom.development.js:20489)
    at interactiveUpdates (react-dom.development.js:2170)
    at dispatchInteractiveEvent (react-dom.development.js:4882)

Thanks!

[SreejithNS]

Iam also facing same problem with selection and editable options.
When I set selection to true, my editables icon moves to selections area and produces an error when trying to edit a single row data

[mbrn]

I will try to find a solution to this case asap

[bbigras]

Any progress?

[ouweiya]

Disappointed

[IdkMan2]

Same issue here. One thing i have fixed. I have forked this project, fixed the issue with adding new entries and published on NPM: "@idkman/material-table-fixed". This is a temporary fix, meanwhile waiting for concrete fix from the original author.

[vinterdo]

Any progress on this issue?

[watanabethais]

There's any workaround for this?

[ahameleon]

Nice to see some update for this. Such a nice library... Anyone has any idea for workaround on this?

[W1M0R]

Has anyone found a solution or workaround for this issue? It still happens with the latest release.

[W1M0R]

The workaround I am currently using is to not set the editable prop, and to set the actions prop to:

[{
icon: (props: any) => (<DeleteOutline />),
tooltip: 'Delete',
onClick: (event: any, rowData: any) => {
  console.log('bla on click', rowData);
}
}]

[stale[bot]]

This issue has been automatically marked as stale because it has not had recent activity. It will be closed if no further activity occurs. Thank you for your contributions. You can reopen it if it required.