Question

I have an issue with kendo grid i have a window and inside the window there is a tabstrip the content of the tab is two grid which are shown in tab1 and tab2 respectively ,also the window is invisible at first.

My problem is the grid in the second tab height exceeds the original grid-content height.
i have recreated the problem in jsfiddle clickhere.I think someone can help me.

Answer 1

For getting the result as described in above comment:

You want a grid that shows all results not using paging but scrolling. But this grid is inside a tabstrip tab (that happens to be inside a window) so it should not overflow its container (the tabstrip tab)

You should:

1. As far as I know, height is not a valid option of kendoTabStrip, you can remove it.
2. You don’t want paging but bring all results from the server and then scroll. So you need to remove pageable: ... from your Grid initialization as well as pageSize: 10 from the DataSource initialization.
3. After the creating the grid, you should remove a height styling that Kendo UI introduced since it is not correctly calculated (!?) by doing $("#grid2").css("height","");. This seems to me a little tricky but I couldn’t get it running otherwise.
4. You should reduce the height of the grid a little otherwise it doesn’t fit in the window. I changed it to 450.

In the following modification of your example I did this modifications for grid2 (only for grid2).