Command

Question

How do i identify which button is clicked without a ID?

And how to change the button background color to bootstrap primary blue color?

 this.commands = [{ buttonOption: { cssClass: "e-flat", content: "Approve",isPrimary:true } }, { buttonOption: { cssClass: "e-flat", content: "Deny" } }];

commandClick(args: any) {
    console.log('redirect IN', args);
    // this.selItemRow =  args.rowData;    
  }

Rajapandiyan Settu · Accepted Answer

Hi Vin,

Thanks for contacting Syncfusion support.

Query #1: How do i identify which button is clicked without a ID?.

We have validated your query at our end. By using innerText of the button, you can differentiate which button is clicked. Find the below code example for more information.

[app.component.ts]

commandClick(args) {

if (args.target.innerText.toUpperCase() == "APPROVE") {

console.log(args.target.innerText.toUpperCase());

// do your action

}

if (args.target.innerText.toUpperCase() == "DENY") {

console.log(args.target.innerText.toUpperCase());

// do your action

}

Query #2: And how to change the button background color to bootstrap primary blue color?

By using Syncfusion’s bootstrap stylesheet, you can bind bootstrap theme to all the Syncfusion components. Refer to the below documentation and code snippet for more information.

Built-in themes:

https://ej2.syncfusion.com/angular/documentation/appearance/theme/

https://ej2.syncfusion.com/angular/documentation/appearance/theme/#referring-individual-component-theme

[index.html]

<head>

// refer syncfusion bootstrap theme file

</head>

We have prepared a sample for your reference. You can get it from the below link,

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

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

Regards,

Rajapandiyan S