How to select the multiple row at initial render in Angular Grid

[Namita]

Hi

I have grid with checkboxes. I want to render that grid with multiple rows selection

This is Grid, but selection is not happening.

ts code:-

ShowSelectedRoleRows(UserRoleTags) {

    debugger;

    let indexs: number[] = [];

    if (UserRoleTags != null) {

      for (let i = 0; i < UserRoleTags.length; i++) {

        (this.RoleGrid.dataSource as object[]).forEach((sdata, index) => {

          if (sdata["Id"] === UserRoleTags[i]['RoleId']) {

            indexs.push(index);

          }

        });

      }

      this.RoleGrid.selectionModule.selectRows(indexs);

      //this.selectedRowIndex = [0, 1, 2];

    }

Kindly do needful.

[Vignesh Sivagnanam]

Hi Namita 

Thanks for contacting Syncfusion support. 

Query : Rendering grid with multiple rows selection 

 

Based on your query, we found that you like to render the grid with the multi-row selection at initial rendering. To achieve your requirement we suggest you use the selectRows method in dataBound() event to select the multiple rows in the grid while rendering. Here, we have prepared a sample based on your requirement. 

Please refer the below code example and sample for your reference. 

 

app.component.ts: 

public dataBound(args): void { 

      const  indexs: number[] = [];  

      const EmployeeID = 'EmployeeID'; 

        (this.grid.dataSource as object[]).forEach((sdata, index) => {  

        if (sdata[EmployeeID] == 4) { 

            indexs.push(index); 

        } 

      }); 

      this.grid.selectionModule.selectRows(indexs); 

      } 

 

In the above sample we have selected the row when the EmployeeID value is 4. 

 

Sample : https://stackblitz.com/edit/angularsample-wr3fly?file=app.component.ts 

API DOC : https://ej2.syncfusion.com/angular/documentation/api/grid/#selectrows 

Screenshot for your reference :  

 

 

Kindly get back to us if you have further queries.  

Regards, 

Vignesh Sivagnanam 

[Mohamed BEN AYED]

Hello,

When we change the page, the selection is wrong.

please see screenshot below

[Joseph Christ Nithin Issack]

Hi Mohamed,

  Before proceeding with the solution, kindly share the below details.

• Complete grid rendering code.
• Video demo of the issue you are facing.
• Simple sample to reproduce the issue.
• Steps to reproduce the issue.
• Syncfusion package version you are using.