Custom Pager for Grid

Hi Syncfusion Team,

How can I customize events when clicking on a page number or sizes dropdown to perform tasks such as data fetching?

It seems that the default pager of the grid currently does not allow that. I've also tried using PagerComponent, but the size dropdown is not being displayed.

Is there any other way for me to achieve this?

Thanks.

Image_6720_1698157911620


1 Reply

VS Vikram Sundararajan Syncfusion Team November 3, 2023 10:11 AM UTC

Hi Hung Luong,


Greetings from Syncfusion support,


Based on your query, when you click the page number or change the page sizes, you want to perform a specific task. You can achieve this with default paging. In paging, when you change the page or page sizes, you can obtain the requestType in the actionBegin event. By using this information, you can customize your desired actions. Please refer to the code snippet, sample, and API documentation for more information.


  [index.js]

 

const actionBegin=(args)=>{

        if(args.requestType==="paging"){

            console.log(args)

           //You can perform what you want

        }

    }

 


Sample: https://stackblitz.com/edit/react-2tyh7k-5kqvft?file=index.js

actionBegin: https://ej2.syncfusion.com/documentation/api/grid/#actionbegin


If we misunderstood anything wrongly, please share the below details that would be helpful for us to provide better solution.


  1. Could you please provide us with a comprehensive description of your query and outline your desired scenario?
  2. Kindly share the complete code snippet that pertains to rendering the Grid. Having access to the full code will enable us to review your implementation thoroughly, identify potential issues, and offer any necessary suggestions.
  3. If possible, please provide a sample that showcases the specific issue you're encountering. Having a sample will allow us to directly analyze and validate your query, resulting in a quicker and more precise resolution.


Regards,

Vikram S


Loader.
Up arrow icon