Question: intercept on click action of the top-checkbox in the checkbox-column (Grid) ?

[Viktor]

Hi,
sorry if this question has been asked before.
is it possible to intercept on click action of the top checkbox in the checkbox-column?
or see picture below.
i am aware of the checkboxchange event (https://ej2.syncfusion.com/documentation/api/grid/#checkboxchange)
but it doesn't seem to be realy helpful since it triggers on all checkboxes in checkbox column.
thanks in advance
viktor

[Manivel Sellamuthu]

Hi Viktor, 

Thanks for contacting us. 

Yes. You can distinguish the header and row checkboxes based on the checkBoxChange event target. Please find the below code example and sample for more information. 

App.component.html 

   <ejs-grid #grid [dataSource]='data' allowPaging='true' [enableHover]="false"  (checkBoxChange)="checkBoxChange($event)" [allowSelection]="true" [selectionSettings]="selectOptions" [editSettings]='editSettings' [toolbar]='toolbar'> 

. . . 

    </ejs-grid> 

App.component.ts 

export class AppComponent { 

. . . 

    public checkBoxChange (args) { 

      if (args.target.classList.contains('e-checkselectall')) { 

        console.log ('Header checkBox is clicked'); 

      } 

      else { 

        console.log ('Row checkbox is cliked'); 

        // here you can get the row information for the checkBox clicked row 

        console.log(this.grid.getRowInfo(args.target)); 

      } 

    } 

} 

Sample: https://stackblitz.com/edit/angular-146973?file=main.ts 

Please get back to us, if you need further assistance. 

Regards, 

Manivel 

[Viktor]

Thank you Manivel for your quick response !

it works perfectly.

regards

Viktor

[Manivel Sellamuthu]

Hi Victor, 

We are happy to hear that your requirement has been achieved. 

Please get back to us, if you need further assistance. 

 

Regards, 

Manivel