I'm having some trouble displaying the Grid's pager info component. Per the documentation and demo at https://www.telerik.com/kendo-react-ui/components/grid/paging/, I am attempting to set the grid's pager in the following manner:
However, when the grid is rendered, the div containing the pager info is still set to display: none, seemingly being set by
~@progress/kendo-theme-bootstrap/dist/all.scss.
I'm therefore having to apply the following styling in order to render the pager info:
But of course, this applies to all instances of my grid. I can work around this problem by using more specific css selectors, but I'd like to be able to simply use the info attribute of GridPagerSettings to render the pager info div.
Any insight or assistance would be hugely appreciated!
I am using "kendo-react-grid": "^5.10.1"
const pagerSettings: GridPagerSettings = { type: "input", pageSizes: [10,100], info: true };<Grid
pageable={pagerSettings}
...
>
...
</Grid>~@progress/kendo-theme-bootstrap/dist/all.scss.
I'm therefore having to apply the following styling in order to render the pager info:
.k-pager-info {
display: block !important;
}Any insight or assistance would be hugely appreciated!
I am using "kendo-react-grid": "^5.10.1"
1 Answer, 1 is accepted
1
Hi Noah,
I have tried the pagerSettings that you have shared, but the pager info is displaying correctly when the "info" property is set to "true":
If the issue on your side persists, please try to modify the example so it can replicate the missing info. Thus we will be able to test and debug it locally and see if we can pinpoint the root cause of the problem.
Looking forward to your reply.
Regards,
Konstantin Dikov
Progress Telerik
Love the Telerik and Kendo UI products and believe more people should try them? Invite a fellow developer to become a Progress customer and each of you can get a $50 Amazon gift voucher.
Noah
commented on 22 Mar 2023, 07:49 PM
Top achievements
Rank 1
Rank 1
Thank you for your response, Konstantin! As it turns out, the reason I was not seeing the change was due to a local build issue. Sorry for the false alarm!