Support for editing only few cells of a row

Hello Janaki,

Thank you for contacting us.

From what I understand you are using the inline editing. Using the cellRender would be possible, but you will have to implement logic that will render the view cells for the cells that you don't want to be editable for the row (based on your conditions within the dataItem):

• https://stackblitz.com/edit/react-pc6qrk?file=app%2Fmain.jsx

In the above example I have added a very basic example on how to prevent the default rendering of the ProductName editor cell and replace it:

  const cellRender = (td, props) => {
    if (props.rowType == 'data' && props.dataItem.inEdit) {
      if (props.field == 'ProductName') {
        return <td {...td.props}>{props.dataItem[props.field]}</td>;
      }
    }
    return td;
  };

You can replace the inner condition with your custom logic for determining which field should not be editable.

Another solution would be to define custom "cell" for the columns and add the rendering logic inside each cell:

• https://www.telerik.com/kendo-react-ui/components/grid/editing/editing-custom/

As you will notice in the custom myDropDownCell, the only condition for rendering the cell with the editor is dataItem.inEdit, so you can modify it by adding additional logic for rendering the editor.

Hope this helps.

Regards,
Konstantin Dikov
Progress Telerik