I am new in to the igx grid, so don't no how to selected first row by default. So please help me into that.
Hello,
Thank you for contacting us!
To be able to apply initial row selection, first you have to set the primaryKey and the rowSelectable property for the IgxGrid.
<igx-grid #grid [data]="data" width="100%" height="500px" [primaryKey]="'ProductID'" [rowSelectable]="true">
The initial selection is made through the IgxGrid API:
ngAfterViewInit(){ this.grid.selectRows([1]); this.grid.markForCheck(); }
The row indexes start from 0.
Keep in mind that the IgxGrid ChangeDetectionStrategy is OnPush, so when you apply changes to the Grid, you have notify it, which is done with the markForCheck() method.
I made a StackBlitz sample, based on your requirement.
Please, take a look at the sample and let me know if you have any questions.
Thanks for your replay.
Actually its working for me but i didn't need [rowSelectable]. When grid load it will select first row and service call there. So after select first row data fetch and it will bind to other component.
In your case it will select first row but it will not throw any event. Below my code for your reference:
<igx-grid #grid [data]="dataSource" [primaryKey]="'assetCgSym'" [rowS [displayDensity]="'compact'" (onSelection)="handleRowSelection($event)">
handleRowSelection(event) { const targetCell = event.cell as IgxGridCellComponent; console.log(targetCell.row.rowData); }