Devextreme-reactive: Material UI table / Editing cell

[geoffreyLB]

Hi Guys,

Wondering if you have already implement specific editing cell in the edit mode ? I can't figured out yet.

For exemple, I just wan't to edit column 'name' & 'city' but not the others. Is that possible with React ?

Thanks

[SergeyAlexeev]

Hi,

To implement your scenario you can use the editCellTemplate property of the TableEditRow plugin.

See the following code:

<TableEditRow
  editCellTemplate={({ column, value }) => {
    if (column.name !== 'name' && column.name !== 'city') {
      return (<TableCell>{value}</TableCell>);
    }
    return undefined;
  }}
/>

Here I render a cell without an editor if a column name doesn't equal 'name' and 'city'. Otherwise, I use the default edit cell template.

[bloomdido]

@SergeyAlexeev - How are you accessing the <TableCell/> component in the code above? I appears to be located in /packages/dx-react-grid-material-ui/src/templates/table-cell.jsx, but I can't find it being exported anywhere.

[SergeyAlexeev]

@bloomdido <TableCell/> is Material UI component.

You can access it using this code:

import { TableCell } from 'material-ui';

[bloomdido]

Yes, but that it won't match the TableCell found in templates, which overrides some styling and supports the column.align property. In order to use the stock material-ui TableCell, you will have clone the same changes.

Sounds like this is just not supported at this time. Should I open a feature request to allow exporting the templates so they can be used without having to clone their code?

[SergeyAlexeev]

Thank you for the additional information. I've created a separate issue.

[geoffreyLB]

It work like a charm in my side.

thanks you !

[lock[bot]]

This thread has been automatically locked since it is closed and there has not been any recent activity. Please open a new issue for related bugs or feature requests.