How to pass custom data to the custom pager?

[Janaki Ram]

Hi,

I have a requirement to pass some custom data to custom pager which I will be using within my custom pager component. I did not find a way to do so. For e.g. in my case I want to pass the number of filtered rows that I get from backend and show that in the custom pager component.  Could you please let me know? 

 

Thanks for your help!

Janaki

[Konstantin Dikov]

Hi Janaki,

Thank you for contacting us.

In order to pass references from the main component to the custom pager you can use React Context and wrap the Grid in it:

• https://reactjs.org/docs/context.html

The same approach is applicable for passing references to custom cells for example. You can use the following example for using React Context with custom cell as a reference:

• https://stackblitz.com/edit/react-yr7z7g-jsxzmz?file=app%2Fmain.jsx

Hope this helps.

 

Regards,
Konstantin Dikov
Progress Telerik

[Janaki Ram]

Hi Konstantin,

Thanks for the response and providing the example. 

Yes, using React Context it would be possible as suggested by you. I was expecting if there was a support available at Grid  or Pager API level. 

Regards,

Janaki

[Konstantin Dikov]

Hi Janaki,

The Grid will pass PagerProps to the custom pager component, which includes the skip, take, total, etc. values from the current state of the Grid:

• https://www.telerik.com/kendo-react-ui/components/datatools/api/PagerProps/

With the above in mind, if you are changing those properties in the Grid when you are filtering the items, you should be able to retrieve the number of rows after the filtering within the PagerProps even without using context.

[Janaki Ram]

Hi Konstantin,

I had a look at PagerProps earlier which has a total field in it. 

But my requirement is different. Once the filter criteria is applied, the backend API gives me new total rows which are now the total filtered rows and as well as the  total unfiltered rows. We had a requirement  of showing both - total filtered rows and total unfiltered rows in the custom pager. So my doubt was around how to pass total  unfiltered rows to the custom pager when filter criteria is applied. The total field of PagerProps corresponds to total filtered rows when filter criteria is applied . Hope this clarifies.

[Konstantin Dikov]

For the additional value, in this case the unfiltered rows number, you will have to use the Context as suggested in the initial reply.

Please let us know if additional questions on this matter arise.