I want to select all the records of current page only

Viewed 397

I am using igx-grid. When I am clicking on select all using rowSelection, it selecting all the records present in grid, not of current page. I want to enable something by which when I click on select all of igx-grid checkbox, it should select only current page record, not all. Is there any way to do the same? Because I am trying it from last 3 days but not getting any solution. Thanks in Advance!!!

2 Answers

Select Rows programmatically :

<button (click)="this.grid.selectRows([1,2,5], true)">Select 1,2 and 5</button> 

Deselect Rows programmatically :

<button (click)="this.grid.deselectRows([1,2,5])">Deselect 1,2 and 5</button>

Source : Official documentation of igx-grid (Row Selection)

Try using (onRowSelectionChange) Event

You can use this.grid.deselectRows([1,2,5]) as @Toxy said but as arguments you can use the property dataView of IgxGridComponent that is an array of only row data displayed in the grid.

onRowSelectionChange(event) {
    this.grid.selectRows(this.grid.dataView.map(x => x.id), true);
    this.currentSelection = this.grid.selectedRows;
}

This not have problem with filters because dataView change when filters are applied. Now in this.currentSelection there are only the page id data. Only little problem is that, graphical, the row data of other pages appears selected (despite they are not presente in this.grid.selectedRows); I resolved this issue using (pageChange)="onPageChange($event)" and when page changes this.grid.deselectAllRows(false); false argument let you to deselect all rows in the grid regardless of filters.

Related