Grid with subgrids: subgrids not sized properly


I’m using a grid, where each row can be expanded to a subgrid. When I click a plus, the subgrid shows, but the height of the row containing the subgrid is too large, so there is extra vertical space and it looks bad. Closing the subgrid and reopening it resolves the problem, but I need it to display correctly the first time it is expanded.

Looking at a similar topic, I was hoping this would do the trick:


Unfortunately, that had no effect. Any other ideas?

Thanks in advance,


You may try to use

mygrid.attachEvent("onSubGridLoaded", function(sub_grid_obj,rId,rInd){ sub_grid_obj.setSizes() });

This doesn’t seem to work. If I place a breakpoint on the setSizes() line, it does not stop.

Manually closing and re-opening the row containing the subgrid fixes everything. Is there a way to do this in Javascript?


The onSubGridCreated event fires, but onSubGridLoaded does not.

Is there a resolution for this? I see the same problem in that my subgrid/main grid do not have proper height. “setSizes()” does not resolve it and the “onSubGridLoaded” event does not fire…

Try to use the following function to force the sizes of the subgrid:

grid.attachEvent("onSubGridCreated",function(subgrid){ ... subgrid.load(data, function(){ subgrid.callEvent("onGridReconstructed",[]); ... }); })