Get Displayed Count after initial load and filter

[Jesse LaVere]

Hello,

I have a grid loaded with local data. It has some initial filters set. I would like to update an external div with the found count after the table loads and filters.

For example, if I have 500 records, and after loading and filtering there are 200 records displayed, how can I get that count?

<GridComponent

dataSource={tableData}

filterSettings={filterOptions}

>

<ColumnsDirective>

{columnDirectives}

</ColumnsDirective>

<Inject services={services} />

</GridComponent >;

<div>Count: </div>

[Rajapandi Ravi]

Hi Jesse, 

Greetings from syncfusion support 

We have analyzed your query and we could see that you like to show the filtered records count at the external div element. You can achieve your requirement by using getFilteredRecords() count of Grid. Please refer the below code example and sample for more information. 

 

 

dataBound() { //dataBound event 

     document.getElementsByClassName('filtercont')[0].innerText = "Filtered records count" + ": "+ this.gridInstance.getFilteredRecords().length;  

                                                                                                                                                     //se the filtered records count to the div in dataBound event 

    } 

 

Sample: https://stackblitz.com/edit/react-spgvdh?file=index.js 

Regards,
Rajapandi R 

[Jesse LaVere]

Very helpful. Thank you.

[Rajapandi Ravi]

Hi Jesse, 

We are happy to hear that our suggested solution was worked fine at your end. 

Please get back to us if you need further assistance.  

Regards,  

Rajapandi R