SubGrid Re-sizing Issue

After the page load, when you open a sub_grid, mail grid row’s height won’t get adjusted according to the sub-grid. But if you open the same row’s sub-grid for the second time, row’s height get adjusted properly. Code is also attached with this.

<link rel="STYLESHEET" type="text/css" href="codebase/dhtmlxgrid.css">
<link rel="stylesheet" type="text/css" href="codebase/skins/dhtmlxgrid_dhx_skyblue.css">
<script  src="codebase/dhtmlxcommon.js"></script>
<script  src="codebase/dhtmlxgrid.js"></script>
<script  src="codebase/dhtmlxgridcell.js"></script>    
<script  src="codebase/excells/dhtmlxgrid_excell_sub_row.js"></script>    
<script  src="codebase/dhtmlxgrid_srnd.js"></script>    
 
<div id="gridbox" style="width:600px;height:500px;background-color:white;"></div>

<script>
	mygrid = new dhtmlXGridObject('gridbox');
	mygrid.setImagePath("codebase/imgs/");
	mygrid.setHeader("&nbsp;,Book Title,Author,Price,In Store,Shipping,Bestseller,Date of Publication");
	mygrid.setInitWidths("30,150,100,80,80,80,80,200");
	mygrid.setColAlign("right,left,left,right,center,left,center,center");
	mygrid.setColTypes("sub_row,edtxt,ed,price,ch,co,ra,ro");
	mygrid.attachEvent("onSubGridCreated",function(sub,id,ind,value){         
		mygrid.enableColumnAutoSize( true );
		sub.loadXML("common/sub.xml"); 
		sub.setSizes();
	});
	mygrid.setRowTextStyle(5,"height:170px;")	
	mygrid.enableAutoHeight(true);
	mygrid.init();	
	mygrid.setSkin("dhx_skyblue");
	mygrid.loadXML("common/sgrid.xml");
</script>
<Body>
</body>

if anyone have a solution for this please advice.

change

sub.loadXML(“common/sub.xml”);

as

sub.loadXML("common/sub.xml",function(){ mygrid.callEvent("onGridReconstructed",[]) });

Really appreciate your reply. But still I have the same issue

Just figured it out. Made a small change. Here it is. It works now.

sub.parse(partsFinXML, function(){
    sub.callEvent("onGridReconstructed", [])
});