How to Select All Rows when DataGrid initialises

Hi,

I would like to Select All rows in the DataGrid once it has initialised, but I cannot find a method for doing this.  I have used the following documentation which provides a method for making the visible rows selected based on a condition:


The SelectRows method above uses the currently visible rowIndex to make the rows selectable, but I would like to select all rows including those that are not visible (due to paging etc).  Ideally, I could make all the rows selected and persist selection so that if the user Unselects a row I can respond to the RowDeselected event.

Is it possible to Select All programmatically, as if I am clicking the Select All button in the header?

 Brad

1 Reply 1 reply marked as answer

RS Renjith Singh Rajendran Syncfusion Team August 7, 2020 11:42 AM UTC

Hi Brad, 

Greetings from Syncfusion support. 

We have used the Microsoft.Jsinterop to achieve this requirement. In the Created event handler of Grid, we have called the JavaScript function, in which we have fetched the Select All header checkbox element and used the click() method to programmatically click the select all checkbox header and select all rows in Grid at initial rendering. 

We have prepared a sample based on this scenario, please download the sample from the link below, 

Please refer and use as like the below codes, 

 
<GridEvents Created="Created" TValue="Order"></GridEvents> 

public async Task Created(){    await IJsRuntime.InvokeAsync<object>("SelectAll");}
[SelectAll.js] 

function SelectAll() {    document.getElementsByClassName("e-checkselectall")[0].click();}

Please get back to us if you need further assistance. 

Regards, 
Renjith Singh Rajendran. 


Marked as answer
Loader.
Up arrow icon