Multple Sub Grid Issue

I am trying to have 3 levels of sub-grid but the 2nd subgrid doesn’t seems to work, only the first level works.
Using firebug I can see that the data request is fetched from the server-side but it failed to render.
I am using the trial pro version.
This is my code.

[code]




 


			data =  "@com.ortech.spartans.tmr.controllers.reports.routes.ServiceQualityPerformanceSubgrid.sqpAllTestSubgrid()";
				       
			var timeStart = new Date().getTime();
			mygrid = new dhtmlXGridObject('gridbox');
			mygrid.setImagePath("@routes.Assets.at("codebase/imgs/")");
			mygrid.setHeader(" ,Level1, Date, Pop, Product, Country, bids, seizure, answer, ner, tcd, pdd, rna, bbusy, abn, de, cong, tf, oth");
			mygrid.enableAutoWidth(true);
			mygrid.setColumnHidden(1,true);
			//mygrid.setInitWidths("30,*,*,*,*,100,*,*,*,*,*,*,*,*,*,*,*,*,*");
			mygrid.enableAutoHeight(true);
			mygrid.setColAlign("right,left,left,left,left,left,left,left,left,left,left,left,left,left,left,left,left,left,left");
			mygrid.setColTypes("sub_row_grid,ro,ro,ro,ro,ro,ro,ro,ro,ro,ro,ro,ro,ro,ro,ro,ro,ro,ro");
			mygrid.setSizes(true);				
			mygrid.attachEvent("onSubGridCreated", function(subgrid, id, ind, dataSub) {
							subgrid.setImagePath("@routes.Assets.at("codebase/imgs/")");
							subgrid.setHeader(" ,Level2,OxCarrier, TxCarrier, bids, seizure, answer, ner, tcd, pdd, rna, bbusy, abn, de, cong, tf, oth");
							subgrid.setColumnHidden(1, false);
							subgrid.setColAlign("right,left,left,left,left,left,left,left,left,left,left,left,left,left,left,left,left");
							subgrid.setColTypes("sub_row_grid,ro,ro,ro,ro,ro,ro,ro,ro,ro,ro,ro,ro,ro,ro,ro,ro");
							subgrid.setSkin("dhx_skyblue");
							subgrid.enableAutoHeight(true);
							subgrid.setSizes(true);								
							subgrid.attachEvent("onSubGridCreated", function(subgridLevel2, id, ind, dataSubLevel2) {
												subgridLevel2.setImagePath("@routes.Assets.at("codebase/imgs/")");
												subgridLevel2.setHeader("CauseCodeDescr, bids, seizure, answer, ner, tcd, pdd, rna, bbusy, abn, de, cong, tf, oth");
												subgridLevel2.setColAlign("left,left,left,left,left,left,left,left,left,left,left,left,left,left");
												subgridLevel2.setColTypes("ro,ro,ro,ro,ro,ro,ro,ro,ro,ro,ro,ro,ro,ro");
												subgridLevel2.setSkin("dhx_skyblue");
												subgridLevel2.enableAutoHeight();
												subgridLevel2.setSizes();
												subgridLevel2.init();
												subgridLevel2.load(dataSubLevel2+"?level2=" + subgrid.cells(id, 1).getValue(), function(){
													subgridLevel2.callEvent("onGridReconstructed",[]);
													mygrid.setSizes();
												}, "json"); 
												return false;
											});
							subgrid.init();
							subgrid.attachEvent("onBeforePageChanged",function(){
												if (!this.getRowsNum())
													return false;
												return true;
											})
							
							subgrid.load(dataSub+"?level1=" + mygrid.cells(id, 1).getValue(), function(){
							   subgrid.callEvent("onGridReconstructed",[]);
							    mygrid.setSizes();
							}, "json");  
							return false;
            });
    		
    						
			//available in pro version only
			if (mygrid.setColspan)
			    mygrid.attachEvent("onBeforeSorting",customColumnSort)
			mygrid.setSkin("dhx_skyblue");
		    mygrid.init();
		    mygrid.attachEvent("onBeforePageChanged",function(){
		    	if (!this.getRowsNum())
		    		return false;
		    	return true;
	    	})
	    	//this code enables paging and sets its skin
			mygrid.enablePaging(true,15,10,"pagingArea",true,"infoArea");
			mygrid.setPagingSkin("bricks");
			mygrid.attachEvent("onXLE",showLoading);
			mygrid.attachEvent("onXLS",function(){showLoading(true)})//setOnLoadingStart(function(){showLoading(true)})
		  	mygrid.load(data, "json");
			
			 
			function showLoading(fl){
				var span = document.getElementById("recfound")
				if (!span) return;

				if(!mygrid._serialise){
					span.innerHTML = "<i>Loading... available in Professional Edition of dhtmlxGrid</i>"
					return;
				}
				span.style.color = "red";
				if(fl===true)
					span.innerHTML = "loading...";
				else
					span.innerHTML = "";
			}
			
			function customColumnSort(ind) {
			    if (ind == 1) {
			        alert("Table can't be sorted by this column.");
			        if (window.s_col);
			        mygrid.setSortImgState(true, window.s_col, window.a_direction);
			        return false;
			    }
			    var a_state = mygrid.getSortingState();
			    window.s_col = ind;
			    window.a_direction = ((a_state[1] == "des") ? "asc": "des");
			    reloadGrid();
			    return false;
			}
			
			/* function reloadGrid() {
			   // var nm_mask = document.getElementById("search_nm").value;
			  //  var cd_mask = document.getElementById("search_cd").value;
			    mygrid.clearAll();
			   // mygrid.loadXML("@com.ortech.spartans.tmr.controllers.reports.routes.Servicequalityperformance.getSqpAllXML()");
			   mygrid.load(data,"json"); 
			   if (window.a_direction)
			    mygrid.setSortImgState(true, window.s_col, window.a_direction);
			    showLoading();
			} */
			
			function reloadGrid(){
				//var nm_mask = document.getElementById("search_nm").value
				//var cd_mask = document.getElementById("search_cd").value
				showLoading(true)
				//mygrid.clearAndLoad("@com.ortech.spartans.tmr.controllers.reports.routes.Servicequalityperformance.getSqpAllXML()");
				//dataSort = "@com.ortech.spartans.tmr.controllers.reports.routes.Servicequalityperformance.sqpAllTest()?orderBy="+window.s_col+"&direction="+window.a_direction;
				//mygrid.clearAndLoad(dataSort);
				//mygrid.clearAndLoad("php/50000_load_grid.php?nm_mask="+nm_mask+"&cd_mask="+cd_mask+"&orderBy="+window.s_col+"&direction="+window.a_direction);
				if (window.a_direction)
					mygrid.setSortImgState(true,window.s_col,window.a_direction);
			}
			</script>
[/code]

Any idea guys?

Thanks.

The issue was fixed.
Please, open ticket at support.dhtmlx.com so we can provide you a fix.