Title: Datagrid: Subgrid inside Subgrid loading and UI issue
Post by: rangaNadha on September 13, 2015, 09:51:16 PM
Hi, I am using SubGrid inside the SubGrid Problem1: SubGrid loading issue At a time only for one row the third level subgrid is displaying. Means on page load what ever the row selected first for that only the third level subgrid is showing on clicking the expand icon. Problem1: Height Issue If i fix the height in the datagrid configuration like "height:'200'" the pagination is not visible. If i give "height:'auto'" the pagination is visible but, it is taking so much height. My code: var fuelListTable = function(index,row){ var fuelDataTable = $('#fuelList-'+index); console.log(fuelDataTable.data('datagrid')); if (!fuelDataTable.data('datagrid')){ fuelDataTable.datagrid({ contentType : 'application/json; charset=utf-8', dataType : 'json', type : "POST", url:'locationFuelList.htm?locationId=' + row.FUEL_LOCATION_ID, pagination:true, autoRowHeight:true, showFooter:true, fitColumns:true, singleSelect:true, height:'200', columns:[[ {field:'FUEL_ID',title:$("#stockBalanceFuelId").text(),width:200}, {field:'FUEL_NAME',title:$("#stockBalanceFuelName").text(),width:100}, {field:'FUEL_GRADE',title:$("#stockBalanceFuelGrade").text(),width:100} ]], onResize:function(){ dataTable.datagrid('fixDetailRowHeight',index); }, onLoadSuccess:function(){ setTimeout(function(){ dataTable.datagrid('fixDetailRowHeight',index); },0); }, //Containers list by fuel --- Start view: detailview, detailFormatter:function(fuelIndex,fuelRow){ return '<div style="padding:2px"><table class="easyui-datagrid work_table" id="containersList-' + fuelIndex + '"></table></div>'; }, onExpandRow: function(fuelIndex,fuelRow){ var containersDataTable = $('#containersList-'+fuelIndex); console.log(containersDataTable.data('datagrid')); if (!containersDataTable.data('datagrid')){ containersDataTable.datagrid({ contentType : 'application/json; charset=utf-8', dataType : 'json', type : "POST", url:'containersByFuelList.htm?fuelId=' + fuelRow.FUEL_ID, pagination:true, autoRowHeight:true, fitColumns:true, singleSelect:true, columns:[[ {field:'CONTAINER_ID',title:$("#stockBalanceContainerId").text(),width:200}, {field:'CONTAINER_NAME',title:$("#stockBalanceContainerName").text(),width:100}, {field:'CURR_INV_BALANCE',title:$("#stockBalanceCurrInvBal").text(),width:100} ]], onResize:function(){ $('#fuelList-'+index).datagrid('fixDetailRowHeight',fuelIndex); dataTable.datagrid('fixDetailRowHeight',index); }, onLoadSuccess:function(){ setTimeout(function(){ $('#fuelList-'+index).datagrid('fixDetailRowHeight',fuelIndex); dataTable.datagrid('fixDetailRowHeight',index); },0); } }); $('#fuelList-'+index).datagrid('fixDetailRowHeight',fuelIndex); } }//Containers list by fuel --- End }); dataTable.datagrid('fixDetailRowHeight',index); } };
dataTable.datagrid({ pagination:true, remoteFilter:true, fitColumns:true, pageSize:10, remoteSort:true, autoRowHeight:true, url:"fuelLocationList.htm", // Fuels list by location --- Start view: detailview, detailFormatter:function(index,row){ return '<div style="padding:2px"><table id="fuelList-' + index + '"></table></div>'; }, onExpandRow: function(index,row){ fuelListTable(index,row); }// Fuels list by location -- End }); dataTable.datagrid('enableFilter');
Thanks in advance
Title: Re: Datagrid: Subgrid inside Subgrid loading and UI issue
Post by: stworthy on September 14, 2015, 01:25:50 AM
The simplest way to create nested sub grid is to call 'subgrid' method. Please refer to this example http://jsfiddle.net/nhk2nyxa/
Title: Re: Datagrid: Subgrid inside Subgrid loading and UI issue
Post by: rangaNadha on September 14, 2015, 05:39:38 AM
Thank you stworthy
It is working now.
But how can i get the all parent grids selected row values?
Title: Re: Datagrid: Subgrid inside Subgrid loading and UI issue
Post by: stworthy on September 14, 2015, 06:29:40 PM
In your sub grid, call the code below to get the parent row. var dg = $('#subdg').datagrid('getParentGrid'); // get the parent datagrid object var index = $('#subdg').datagrid('getParentRowIndex'); // get the parent row index if (index >= 0){ var row = dg.datagrid('getRows')[index]; // the parent row console.log(row); }
Be sure to download the newest 'datagrid-detailview.js' file from http://www.jeasyui.com/extension/datagridview.php
Title: Re: Datagrid: Subgrid inside Subgrid loading and UI issue
Post by: rangaNadha on September 15, 2015, 02:29:55 AM
It is working fine.... Thank You very much stworthy
|