How to restrict deleting a row using keyboard delete in ej2 syncfusion angular grid

Hi Team,

Issue 1:

In an ej2 syncfusion grid in batch edit mode

After clicking on delete without selecting any record or on keyboard delete click, I am able to see this popup which is shown in the screenshot mentioned below,

we don't need this popup to be shown

can you please provide info for restricting this popup.



Issue 2:

In an ej2 syncfusion grid in batch edit mode how to restrict deleting a row with keyboard delete click,

rows should not delete on keyboard delete click.

Can you please provide any solution to restrict it.


Thank you,

Lahari Navudu.


1 Reply

PS Pavithra Subramaniyam Syncfusion Team August 8, 2022 01:38 PM UTC

Hi Lahari Navudu,


Thanks for contacting Syncfusion support.


Query#1: After clicking on delete without selecting any record or on keyboard delete click, I am able to see this popup which is shown in the screenshot mentioned below, we don't need this popup to be shown


You can prevent the delete confirmation dialog inside the “open” event of the dialog component. Please refer to the below code example for more information.


created() {

  (this.grid.editModule as any).alertDObj.open = (args) => {

    if (args.element.innerText == 'No records selected for delete operation\nOK') {

      (this.grid.editModule as any).alertDObj.hide();

    }

  };

}

 


Query#2: In an ej2 syncfusion grid in batch edit mode how to restrict deleting a row with keyboard delete click,rows should not delete on keyboard delete click.


You can override the delete key function by modifying the Grid default key configuration. Please refer to the below code example for more information.


created() {

  this.grid.keyboardModule.keyConfigs.delete = '';

}

 


API        : https://ej2.syncfusion.com/angular/documentation/api/grid/#created

                 https://ej2.syncfusion.com/angular/documentation/api/dialog/#open

                https://ej2.syncfusion.com/angular/documentation/api/dialog/#hide


Sample : https://stackblitz.com/edit/angular-ogsvkd?file=app.component.ts,app.component.html


Please get back to us if you need further assistance on this.


Regards,

Pavithra S


If this post is helpful, please consider Accepting it as the solution so that other members can locate it more quickly.


Loader.
Up arrow icon