Material-table: How to put multiple rows into edit mode?

[thedmeyer]

I would like to be able to select multiple rows and that selection would in turn reveal the EditRow for each row without closing the previous and no opacity changes to the background.

So far, I have been able to reach into the dataManager and trigger changeRowEditing(row, 'update') but this doesn't work for more than one selection...

const onSelectionChange = (rows) => {
    rows.forEach((row) => {
      tableRef.current.dataManager.changeRowEditing(row, 'update');
    });
};

Second to this, can the edit pen icon be removed once this behavior is implemented?

[NLeRoy917]

I was wondering how to do this too - little luck. I did find this, however, and seems to be a ok alternative

[NLeRoy917]

Playing around - an even more intuitive solution (I think) would be to always have it editable. You can change the onRowClick prop to launch editing mode whenever you click a row:

Add the following prop to <MaterialTable />

components={{
        Row: props => (
          <MTableBodyRow
            {...props}
            onRowClick={() => {
               props.actions[1]().onClick(e, props.data);
            }}
          />
        )
      }}

In addition - I manually added the code changes from this PR to make it so that a user can simply hit Enter to approve editing. (I manually added them, since the PR wasn't approved yet)

[p9614]

@NLeRoy917
In the example all columns open the same action but, How can you make each column do a different action?

[NLeRoy917]

What is the use case here? props.actions is an array with two actions: "update" and "delete". I don't know if you can make each column do a separate action... You can override the column component when editing to allow for custom components to be added in, which has let me do a lot of customizable things.

[p9614]

@NLeRoy917 You're right is another different topic, my question is not focused on the actions edit and delete

[thedmeyer]

The idea is to essentially do a batch edit. It's an incredibly terrible UX to click the edit pen, change a value, click save checkmark over and over again.

We should be able to select multiple rows, put them all in edit mode, make our changes, and then hit a primary save button either external to the table or as part of the table's top toolbar.

@mbrn @p9614

[TCM5]

This is nice feature to add! This could make the table to work just like a data grid

[Domino987]

Can you create a PR to achieve this? It would be a great addition.

[jeffsupancic]

I'm also looking for this feature. @mbrn is this on the road map or anyway we can get it on there?

[mbrn]

Why not? I can do this. But I will focus column resizing after editable cell. Then I can consider this?

[jeffsupancic]

@mbrn very much appreciated! Any idea on how soon this could be in?

[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.