How to save the cell value without moving to the next cell or pressing the 'Enter' key in a React Spreadsheet.

This article explains how to save the cell value in a React Spreadsheet without moving to the next cell or pressing the ‘Enter’ key. By default, the edited cell value is saved when you click on another cell or press the ‘Enter’ key, similar to MS Excel.

You can save the edited cell value immediately by using the cellEditing event in conjunction with the updateCell method. The cellEditing event is triggered for each key action entered in the editor. You can update the cell with the value and address obtained from the cellEditing event by utilizing the updateCell method within the event handler.

[index.js]

import { createRoot } from 'react-dom/client';
import './index.css';
import * as React from 'react';
import { SpreadsheetComponent, getCell } from '@syncfusion/ej2-react-spreadsheet';

const Default = () => {
   let spreadsheet;
   const cellEditing = (args) => {
       if (args.value !== args.oldValue) {
           spreadsheet.updateCell({ value: args.value }, args.address);
       }
   }
   return (<div className='control-section spreadsheet-control'>
       <button className="e-btn" onClick={getData}>Get Data</button>
       <SpreadsheetComponent ref={(ssObj) => { spreadsheet = ssObj; }} cellEditing={cellEditing}>
       </SpreadsheetComponent>
   </div>);
}
export default Default;

const root = createRoot(document.getElementById('sample'));
root.render(<Default />); 

Refer to the working sample for additional details and implementation: Cxvbq7 (forked) - StackBlitz

For further details regarding editing, please refer to the following reference.

https://ej2.syncfusion.com/react/documentation/spreadsheet/editing