Menu
I have a Jqgrid with two subgrids and a groupingView(), when my data is loaded from the server into the grid my subgrid does not want to expand. Only when I page or click the refresh button the subgrid does expand, or when I set loadonce:false or take out the groupingView() it wil expand and everything is working fine, but then my export to excel is not showing any data. I want my subgrid to expand when the data is loaded for the first time, not after I refresh or page!
I have have tried:
$MyGrid.jqGrid('setGridParam',{datatype:'json'}).trigger('reloadGrid');
and also tried making a trigger to fire the refresh button on loadComplete()
*$(".ui-icon-refresh").each(function () {
$(this).trigger("click");
});*
This trigger button does work when it's clicked, but it does not fire automatically in the loadComplete() function.
Here is my Javascript:
function CreateOrdSummaryTable()
{
if ($("#DataTab_2").length === 0)
{
$("#tdBotRight").html("<table id='DataTab_2' class='dataContent' border='1' align='top'></table>" +
"<div id='PagerDataTab_2'></div>");
}
var $tableOrdSummary = $("#DataTab_2");
$tableOrdSummary.jqGrid({
url: '/Ord/WS/OrderWebSummary.php',
colNames: ["Sum of Order Mass","Customer", "Case", "Associated Mass" ,"Order Mass","Invoiced Mass","Shipped Mass","FGI Mass"],
colModel: [
{ name: "ORDITM", index: "ORDITM", resizable: true, width: 120},
{ name: "CUSTOMER", index: "CUSTOMER", resizable: true, width: 250},
{ name: "CASES", index: "CASES", summaryTpl: "<i>Order Group Total:</i>", summaryType: "sum", resizable: true, width: 250},
{ name: "ASSMASS", index: "ASSMASS", summaryTpl: "<i>{0}</i>", summaryType: "sum", resizable: true, width: 165, formatter: "integer"},
{ name: "ORDMASS", index: "ORDMASS", summaryTpl: "<i>{0}</i>", summaryType: "sum", resizable: true, width: 115, formatter: "integer"},
{ name: "DIST", index: "DIST", summaryTpl: "<i>{0}</i>", summaryType: "sum", resizable: true, width: 130, formatter: "integer"},
{ name: "WIP", index: "WIP", summaryTpl: "<i>{0}</i>", summaryType: "sum", resizable: true, width: 130, formatter: "integer"},
{ name: "MDB", index: "MDB", summaryTpl: "<i>{0}</i>", summaryType: "sum", resizable: true, width: 110, formatter: "integer"}
],
pager: jQuery("#PagerDataTab_2"),
shrinkToFit: false,
autoWidth: false,
caption: "Order Summary",
height: "100%",
rowNum: 1000,
//rowList: [50,100,200],
loadonce: false, //This is to get the Paging to turn on if set to (true)
gridview: true,
footerrow: true,
userDataOnFooter: true,
grouping : true,
groupingView : {
groupField : ["ORDITM"],
groupColumnShow : [true],
groupText: [ // user the name of a column with curly braces to use it in a summary expression.
// {0} is the formula placeholder for the column (defined by the summaryType property
"<i><b>{0} - {1} Order(s)</b></i>"
],
showSummaryOnHide: true,
groupSummary : [true],
groupCollapse : false
},
loadComplete: function () {
var AssSum = parseInt($tableOrdSummary.jqGrid('getCol', 'ASSMASS', false, 'sum'));
var OrdSum = parseInt($tableOrdSummary.jqGrid('getCol', 'ORDMASS', false, 'sum'));
var InvSum = parseInt($tableOrdSummary.jqGrid('getCol', 'DIST', false, 'sum'));
var ShpSum = parseInt($tableOrdSummary.jqGrid('getCol', 'WIP', false, 'sum'));
var FGISum = parseInt($tableOrdSummary.jqGrid('getCol', 'MDB', false, 'sum'));
$tableOrdSummary.jqGrid('footerData', 'set',
{
CASES: '<i><b>Grand Total:</b></i>',
ASSMASS: AssSum,
ORDMASS: OrdSum,
DIST: InvSum,
WIP: ShpSum,
MDB: FGISum
});
},
postData: {
"GroupID": function() {
return groupID();
}
},
subGrid: true,
subGridOptions: {
"plusicon" : "ui-icon-triangle-1-e",
"minusicon" : "ui-icon-triangle-1-s",
"openicon" : "ui-icon-arrowreturn-1-e",
"expandOnLoad" : false,
"reloadOnExpand" : true,
"selectOnExpand" : true
},
subGridRowExpanded: function(subgrid_id, row_id) {
var subgrid_table_id, pager_id;
subgrid_table_id = subgrid_id + "_t";
pager_id = "p_" + subgrid_table_id;
$("#"+subgrid_id).html("<table id='"+subgrid_table_id+"' class='scroll'></table><div id='"+pager_id+"' class='scroll'></div>");
jQuery("#"+subgrid_table_id).jqGrid({
url:"/Ord/WS/OrderItemSummary.php",
datatype: "json",
colNames: ["Item", "RFD Date","Associated Mass", "Order Mass", "Invoiced Mass", "Shipped Mass", "FGI Mass"],
colModel: [
{ name: "ITEM", index: "ITEM", resizable: true, width: 60},
{ name: "RFDDATE", index: "RFDDATE", summaryTpl : "<i>Total:</i>", summaryType: "sum", resizable: true, width: 135},
{ name: "ASSMASS", index: "ASSMASS", summaryTpl: "<i>{0}</i>", summaryType: "sum", resizable: true, width: 180, formatter: "integer"},
{ name: "ORDMASS", index: "ORDMASS", summaryTpl: "<i>{0}</i>", summaryType: "sum", resizable: true, width: 115, formatter: "integer"},
{ name: "DIST", index: "DIST", summaryTpl: "<i>{0}</i>", summaryType: "sum", formatter: "integer", resizable: true, width: 130},
{ name: "WIP", index: "WIP", summaryTpl: "<i>{0}</i>", summaryType: "sum", formatter: "integer", resizable: true, width: 130},
{ name: "MDB", index: "MDB", summaryTpl: "<i>{0}</i>", summaryType: "sum", formatter: "integer", resizable: true, width: 115}
],
rowNum:50,
pager: pager_id,
shrinkToFit: false,
autoWidth: false,
height: '100%',
caption: "Item Summary",
// footerrow: true,
// userDataOnFooter: true,
grouping : true,
groupingView : {
groupField : ["ITEM"],
groupColumnShow : [false],
groupText: [ // user the name of a column with curly braces to use it in a summary expression.
// {0} is the formula placeholder for the column (defined by the summaryType property
"<i><b>Item(s): {0}</b></i>"
],
groupOrder: ["asc"],
groupSummary : [true],
groupCollapse : false,
groupDataSorted : true
},
loadComplete: function () {
// var InvSum = parseInt(jQuery("#"+subgrid_table_id).jqGrid('getCol', 'DIST', false, 'sum'));
// var ShpSum = parseInt(jQuery("#"+subgrid_table_id).jqGrid('getCol', 'WIP', false, 'sum'));
// var FGISum = parseInt(jQuery("#"+subgrid_table_id).jqGrid('getCol', 'MDB', false, 'sum'));
// var AssSum = parseInt(jQuery("#"+subgrid_table_id).jqGrid('getCol', 'ASSMASS', false, 'sum'));
// var OrdSum = parseInt(jQuery("#"+subgrid_table_id).jqGrid('getCol', 'ORDMASS', false, 'sum'));
// jQuery("#"+subgrid_table_id).jqGrid('footerData', 'set',
// {
// RFDDATE: '<i><b>Grand Total:</b></i>',
// ASSMASS: AssSum,
// ORDMASS: OrdSum,
// DIST: InvSum,
// WIP: ShpSum,
// MDB: FGISum
// });
},
postData: {
"GroupRwID": function() {
var myString = onRowSelected(row_id);
var finalString = groupRowID() + myString;
//console.log(finalString);
return finalString;
}
},
subGrid: true,
subGridOptions: {
"plusicon" : "ui-icon-triangle-1-e",
"minusicon" : "ui-icon-triangle-1-s",
"openicon" : "ui-icon-arrowreturn-1-e",
"expandOnLoad" : false,
"reloadOnExpand" : true,
"selectOnExpand" : true
},
subGridRowExpanded: function(subgrid2_id, row2_id) {
var subgrid_table_id2, pager_id2;
subgrid_table_id2 = subgrid2_id + "_t";
pager_id = "p_" + subgrid_table_id2;
$("#"+subgrid2_id).html("<table id='"+subgrid_table_id2+"' class='scroll'></table><div id='"+pager_id2+"' class='scroll'></div>");
jQuery("#"+subgrid_table_id2).jqGrid({
url:"/Ord/WS/OrderCaseSummary.php",
datatype: "json",
colNames: ["Case", "Associated Mass"],
colModel: [
{ name: "CASES", index: "CASES", summaryTpl : "<i>Total:</i>", summaryType: "sum", key: true, resizable: true, width: 130},
{ name: "ASSMASS", index: "ASSMASS", summaryTpl: "<i>{0}</i>", summaryType: "sum", resizable: true, width: 180, formatter: "integer"}
],
rowNum:50,
pager: pager_id,
shrinkToFit: false,
autoWidth: false,
height: '100%',
caption: "Cases Summary",
postData: {
"CaseSum": function() {
var selRwData = '"CASES":"' + cases + '",' + '"ORDITM":"' + ordItm + '",' + '"CUSTOMER":"' + customer + '",' + '"ASSMASS":"' + assMass + '"' +"}";
var finalStr = groupRowID() + selRwData;
return finalStr;
}
}
});
$('#'+subgrid_table_id2).addClass("subGrids");
}
});
$('#'+subgrid_table_id).addClass("subGrids");
}
});
$tableOrdSummary.jqGrid("navGrid","#PagerDataTab_2",
{edit:false,add:false,del:false, refreshstat:"current"},
{},
{},
{},
{multipleSearch:false, multipleGroup:false, showQuery: false}
);
}
function ordSummaryView()
{
$("#DataTab_2").jqGrid('setGridParam',{datatype:'json'}).trigger('reloadGrid'); //This makes the call to refresh the grid.
}
function onRowSelected(rowId)
{
var $tableOrdSummary = $("#DataTab_2");
var rowData = $tableOrdSummary.jqGrid ('getRowData', rowId);
cases = rowData.CASES;
customer = rowData.CUSTOMER;
assMass = rowData.ASSMASS;
ordItm = rowData.ORDITM;
var selRwData = '"CASES":"' + cases + '",' + '"ORDITM":"' + ordItm + '",' + '"CUSTOMER":"' + customer + '",' + '"ASSMASS":"' + assMass + '"' +"}";
return selRwData;
}
function getTotals()
{
var $tableOrdSummary = $("#DataTab_2");
ids = $tableOrdSummary.jqGrid('getDataIDs');
int = 0;
for (var i = 0; i < ids.length; i++)
{
var rowId = ids[i];
var rowData = $tableOrdSummary.jqGrid ('getRowData', rowId);
var distTotal = rowData.DIST;
int += parseInt(distTotal);
}
return int;
}
$(document).ready(function()
{
CreateOrdSummaryTable();
});
Function for GroupRowID():
function groupRowID()
{
var jsonSearchString = "";
var sGroupId = <?php echo "'" . $sGroupId . "'" ; ?>;
jsonSearchString = '"GROUPID":"' + sGroupId + '",';
return "{" + jsonSearchString;
}
419
Following your example, if you add this code into your main grid options, your subgrids will be opened on loadComplete
loadComplete: function(){$(".ui-widget-content.jqgrow.ui-row-ltr td a").click()},
You can see it here: https://jsfiddle.net/f4vosxqo/1/
164
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
