Can't update row data by press enter

Question

Hi Syncfusion Team,I am using Grid and Dialog components. By default, the Grid component allows row data to be updated by pressing Enter after entering values. But when I use Grid with Dialog, this feature is disabled (when I press enter, nothing happens).Sample: https://stackblitz.com/edit/react-qjcvar I hope to use this feature in my project.How can I config to use it?Regards,Hung Ton

Pavithra Subramaniyam · Accepted Answer

Hi Hung Ton,Thanks for contacting Syncfusion support.You can achieve your requirement “Save Record with entering key
while rendering Grid inside Dialog component” by calling the “endEdit”
method inside the “keyPressed” event of Grid component. Please refer to
the below code example, documentation, and sample link for more information.In the below code example, we have called the “endEdit”
method based on some conditions to check whether the current target is a valid
input element and the currently opened popup is the Grid parent Dialog.

keyPressed(e) {
    if (e.code == 'Enter') {
      if (
        !parentsUntil(e.target, 'e-unboundcelldiv') &&
  this.gridInstance.editSettings.mode !== 'Batch' &&
        (parentsUntil(e.target, 'e-gridcontent') ||
  (this.gridInstance.frozenRows &&
            parentsUntil(e.target, 'e-headercontent'))) && document.getElementsByClassName('e-popup-open').length == 1 && document.getElementsByClassName('e-popup-open')[0].id =='GridParentDialog') {
        e.preventDefault();
        this.gridInstance.endEdit();
      }
    }
  }

API        : https://ej2.syncfusion.com/react/documentation/api/grid/#keypressed             
  https://ej2.syncfusion.com/react/documentation/api/grid/#endeditSample : https://stackblitz.com/edit/react-qjcvar-sq82tgPlease get back to us if you need further assistance on
this.Regards,Pavithra S

Ton That Hung · Answer

Thanks for your support.

Pavithra Subramaniyam · Answer

Hi Hung Ton,Most welcome!Please get back to us if you need further assistance on this.Regards,Pavithra S