Rank 3
Bronze
Bronze
Veteran
Hi,
I have a strange issue with grid, and it seems it occurred after I upgraded from 2020 R2 to latest kendo ui version.
I have grids implemented on multiple places and I have 2 themes (Kendo Default and custom dark theme build through theme builder).
When I first load (or reload) page with grid with default (light) theme, it renders normally. If I switch to dark theme everything is fine, but if I load or reload the page with the dark theme, header row misaligns columns with the rest of the grid. (see images).
I even partially debugged and it led me to function
support.scrollbar = function (refresh) {
where support._scrollbar variable is sometimes 0 and sometimes 10 (for the same grid and same data). (it looks to me that sometimes it doesn't take scrollbar into a count when calculating headers). What is also interesting if I try to resize any header column everything snaps back as it should be.
Unfortunately, there is no way I can build replica of everything in dojo, so I would appreciate even vague pointing where to look further.
Thank you very much and regards,
Vedad
Hello, Vedad,
Could you let me know how are the themes loaded when you switch between them?
I have a dropdown with 2 themes (Default and dark). By changing selection on dropdown, I just change css files names used for styling and re-render. Everything renders perfectly fine except grids. (even on grids, styling is fine, but just this misalignment) Even charts are restyled without glitches.
Thanks
Hi, Vedad,
I tried a couple of different ways to reproduce the issue but to no avail. Could you open a private support ticket and share the custom dark theme with us so I can try and debug the problem locally?
In the meantime check the JSFiddle provided by my colleague in this forum post:
https://www.telerik.com/forums/skinselector-to-choose-kendo-css-templates#2672838
It showcases how to load different themes without refreshing the page. I am not certain if you follow the same approach, but in case you don't, give it a try.
Additionally try calling the resize method on page load and see if that makes any difference. I'll keep looking for possible causes while waiting for your reply and I'll let you know if I find something.
thanks for the response. Basically, I do the same thing as your colleague - I am not reloading the page after theme switch, I change files too.
Problem occurs after I switch to dark theme and if I reload the page manually in browser. Also, I think I pinpointed one more clue - this happens 99% in case I have developer tools open. If they are closed, it seems to be very rare.
I will see if I can pinpoint situation when it happens with chrome tools closed.
Thanks again!
Hi, Vedad,
Thank you for the update!
Let me know if you require further assistance or if you have any questions that I could answer.