This is a migrated thread and some comments may be shown as answers.

Kendo UI: Grid header(width) alignment issue inside tabstrip

1 Answer 9 Views
Grid
This is a migrated thread and some comments may be shown as answers.
Mark
Top achievements
Rank 1
Mark asked on 22 Apr 2021, 05:39 AM

I have used KENDO UI two Tabstrips.

Tabstrip One.
Tabstrip Two.

and both tabstrip contains a kendo Grid inside and Grid inside Tabstrip One is fixed column grid (2 fixed column) and 8 scrollable columns.

Issue: The grid inside Tabstrip One will take some 20-30 seconds to load after the page load.
The header of the Grid inside the Tabstrip One breaks, If i navigate to Tabstrip Two before the grid inside the Tabstrip One loading and comes back to Tabstrip One after the grid inside the Tabstrip One finished loading. See the First Image.
However if i click inspect on the Grid header the Grid header comes back to Normal (by self setting the k-grid-header width) See the second Image.

Please let me know if anybody faced similar type of issues.
Thanks in advance

1 Answer, 1 is accepted

Sort by
0
Ivan Danchev
Telerik team
answered on 26 Apr 2021, 03:43 PM

Hello Mark,

Complex components like the Grid, the Gantt, etc. when initialized in initially invisible containers (theTabStrip's tab for example, or a Dialog) in some scenarios need a call to their resize() API method when the container becomes visible, so that they can properly re-calculate their dimensions.

Here's an article that demonstrates how to call the resize() method of a Grid in the TabStrip's "activate" event handler: https://docs.telerik.com/kendo-ui/controls/navigation/tabstrip/how-to/initiliaze-grid-in-tabstrip

Regards,
Ivan Danchev
Progress Telerik

Virtual Classroom, the free self-paced technical training that gets you up to speed with Telerik and Kendo UI products quickly just got a fresh new look + new and improved content including a brand new Blazor course! Check it out at https://learn.telerik.com/.

Tags
Grid
Asked by
Mark
Top achievements
Rank 1
Answers by
Ivan Danchev
Telerik team
Share this question
or