How to implement the pagination feature in a grid to allow jumping to a specific page by inputting the page number and moving forward or backward by 10 pages, while retaining the original grid functionality? This is essentially an enhancement of the grid functionality.
For example: after I input the page number to jump to and press Enter, the grid automatically navigates to the target page. Next to the < or > buttons, there are also 《 or 》 buttons to move forward or backward by 10 pages.
Hi @Cesar GeYou can implement your own page number input, with below Javascript:
And for the next/forward 10 pages button:
You will use this JS to get current page index, plus or substract it for 10 (need to do validation). and then call moveToPage again with the calculated page index.
Hi @Kiet Phan , I would like to modify this part of the grid (marked with a red box) to implement my requirement. Where can I modify this? According to your method, I would need to add an input box and two buttons, which would obviously affect the aesthetics of the page. I'm wondering if there's any way or component that can replace the red box section.
Thank you for your response, best wishes.
theoretically, you can clone the Outsystems DataGrid and modify the code.But the mission seem like very hard.
Thank you for the solution you provided, best wishes.
You're welcome.
Feel free to ask if there is any questions :)