【发布时间】：2015-04-20 06:08:20
【问题描述】：
我有一个带有两个子网格和一个 groupingView() 的 Jqgrid，当我的数据从服务器加载到网格中时，我的子网格不想扩展。只有当我分页或单击刷新按钮时，子网格才会展开，或者当我设置 loadonce:false 或取出 groupingView() 时，它才会展开并且一切正常，但后来我导出到 excel 没有显示任何数据。我希望我的子网格在第一次加载数据时展开，而不是在我刷新或页面之后！
我试过了：
$MyGrid.jqGrid('setGridParam',{datatype:'json'}).trigger('reloadGrid');
并且还尝试在 loadComplete()
上触发触发刷新按钮*$(".ui-icon-refresh").each(function () {
$(this).trigger("click");
});*
此触发按钮在被点击时会起作用，但不会在 loadComplete() 函数中自动触发。
这是我的 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();
});
GroupRowID() 的函数：
function groupRowID()
{
var jsonSearchString = "";
var sGroupId = <?php echo "'" . $sGroupId . "'" ; ?>;
jsonSearchString = '"GROUPID":"' + sGroupId + '",';
return "{" + jsonSearchString;
}
【问题讨论】：
-
您使用哪个版本的 jqGrid？。抱歉，您的代码中有很多内容不清楚。
#tdBotRight最初是否存在于页面上，或者您生成它并动态放置它？为什么您的代码包含外部{ ... }？代码$("#DataTab_2").jqGrid().setGridParam({ datatype: 'local',..})).trigger("reloadGrid");在同一网格的loadComplete内非常糟糕。你明确地使用loadonce: false，但尝试做接近的事情，但以错误的方式。你的目标是什么？ -
此外，您的问题是关于“子网格在首次加载时未扩展”。您想在加载时扩展所有子网格还是某些特定子网格？你使用
subGridOptions: {..., expandOnLoad: false, ...}。为什么子网格应该扩展？ jqGrid 向/Ord/WS/OrderWebSummary.php发送Ajax 请求以加载主网格数据，然后您想为每个子网格向/Ord/WS/OrderItemSummary.php发送多个请求？在加载主网格时加载所有子网格信息不是更好吗？ -
我不希望子网格自动扩展，这将是 expandOnLoad: true。第一次在主网格中加载数据并按下子网格箭头时，它没有扩展！只有当我分页或刷新时，它才会在点击时展开。我理解你所说的多个请求，但不管它应该是有效的。
-
抱歉，
groupRowID()的代码几乎没有提供任何信息，因为$sGroupId是未知的。此外，为什么您需要返回{"GROUPID":"blabla",之类的函数。它是某事的一部分。它没有任何意义。好的接口要么只返回$sGroupId，要么返回对象{GROUPID:"blabla"}。可以使用$.extend将其与其他属性合并。回到你的主要问题。我建议您在网格（子网格）中包含loadError回调。见the answer。 -
您能否包括在子网格中对服务器的第一个请求中使用的完整 URL 以及您在由Fiddler 或 IE/Crome/Firefox 的开发工具生成的 HTTP 跟踪中看到的响应？
标签： javascript php jquery jqgrid