Row Level Configuration of Command buttons in Command Column

[Ram T]

The controls in Command Column in ejs-grid can be customized per table, but are not configurable at the row level. https://ej2.syncfusion.com/angular/documentation/grid/editing/command-column-editing

We have a use-case where we need to show [edit, delete] buttons for some rows and [edit] button only for certain rows. Is there a way to do this via syncfusion ejs-grid.

[Vikram Sundararajan]

Hi Ram,

Greetings from Syncfusion support,

Query: Row Level Configuration of Command buttons in Command Column (Edit button only for certain rows)

We have achieved your requirement using rowDataBound event in Grid. In this event we can access every row and data. using the rowDataBound event of the Grid and add the class ‘e-hide’ to the buttons based on the respective column value.

Please see the attached documentation, code example and sample for more information.

RowDataBound : https://ej2.syncfusion.com/angular/documentation/api/grid/#rowdatabound

[app.component.ts]

 

 rowDataBound(args: any): void {

    if(args.data.OrderID %2===0){

      args.row.querySelector('[title=Delete]').classList.add('e-hide')

   }

  } 

Sample: https://stackblitz.com/edit/angular-ivy-pousko?file=app.component.ts

If you require further assistance, please do not hesitate to contact us. We are always here to help you.

Regards,

Vikram S