我正在使用数据类型为本地的jqGrid。另外,我正在使用subgrid来显示正在单击的行的详细信息。我的JQGrid填充为:
$("#dvShowLogs_" + vsavequeryid).dialog({
title: "Exception/ Exclusion Logs",
autoOpen: true,
position: 'center',
width: 800,
modal: true,
resizable: false,
closeOnEscape: true,
dialogClass: 'mydialogclass',
show: {
effect: "fade",
duration: 500
},
hide: {
effect: "fade",
duration: 500
},
open: function (type, data) {
$("#grdExceptionLogs_" + vsavequeryid).jqGrid
({
url: vURL,
datatype: 'local',
//data: { month: "05", year:"2018" },
mtype: 'Get',
iconSet: "fontAwesome",
guiStyle: "bootstrap",
//postData: { month: "05", year: "2018" },
//table header name
colNames: ['Type', 'UniqueIdentifier'],
//colModel takes the data from controller and binds to grid
colModel: [
{ name: 'Type',width: 200,searchoptions : {
// show search options
sopt: ["cn"]
}},
{
name: "UniqueIdentifier", width: 600, searchoptions: {
// show search options
sopt: ["cn"]
}
}
],
//localReader: {
// repeatitems: false,
// id:'0'
//},
pager: jQuery('#grdExceptionPager_' + vsavequeryid),
height: '100%',
width: 800,
rowNum: 10,
rowList: [10, 20, 30, 40],
//rowList: [1, 2, 4, 5, 10],
sortname: 'Type',
sortorder: "asc",
viewrecords: true,
//loadonce: true,
pgbuttons: true,
pginput: false,
emptyrecords: 'No records',
subGrid: true,
subGridOptions: {
// "plusicon": "ui-icon-triangle-1-e",
//"minusicon": "ui-icon-triangle-1-s",
//"openicon": "ui-icon-arrowreturn-1-e",
// load the subgrid data only once
// and the just show/hide
"reloadOnExpand": false,
// select the row when the expand column is clicked
"selectOnExpand": true
},
subGridRowExpanded: function (subgrid_id, row_id) {
//var currentRow = $("#grdExceptionLogs_" + vsavequeryid).jqGrid('getRowData', 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>");
$("#" + subgrid_table_id).jqGrid({
datatype: "local",
// data:subgridData,
colNames: ['No', 'Item', 'Qty'],
colModel: [{ name: "num",width: 80, key: true },
{ name: "item", width: 130 },
{ name: "qty",width: 70, align: "right" }],
gridview: true,
rowNum: 20,
rowList: [10, 20, 30, 40],
pager: pager_id,
sortname: 'num',
sortorder: "asc",
height: '100%',
width: 500,
});
$("#" + subgrid_table_id).jqGrid('navGrid', "#" + pager_id, { edit: false, add: false, del: false });
var subNames = ["num", "item", "qty"];
var mysubdata = [];
for (var i = 0; i < subgridData.length; i++) {
mysubdata[i] = {};
for (var j = 0; j < subgridData[i].length; j++) {
mysubdata[i][subNames[j]] = subgridData[i][j];
}
}
for (var i = 0; i <= mysubdata.length; i++) {
$("#" + subgrid_table_id).jqGrid('addRowData', i + 1, mysubdata[i]);
}
}
})
.navGrid('#grdExceptionPager_' + vsavequeryid, { edit: false, del: false, add: false,search:false,refresh:false }
, {}, {}, {},
{
//closeOnEscape: true,//
multipleSearch: true,
zIndex: 100,
caption: "Search",
closeAfterSearch: true,
//sopt: ['eq', 'ne', 'lt', 'le', 'gt', 'ge', 'bw', 'bn', 'ew', 'en', 'cn', 'nc', 'nu', 'nn', 'in', 'ni']
sopt: ['cn']
});
for (var i = 0; i <= mydata.length; i++) {
jQuery("#grdExceptionLogs_" + vsavequeryid).jqGrid('addRowData', i + 1, mydata[i]);
}
$("#grdExceptionLogs_" + vsavequeryid).navButtonAdd('#grdExceptionPager_' + vsavequeryid, {
caption: "Show Details",
title: "Show Details",
// buttonicon: "fa fa-download",
onClickButton: function () {
}
});
// activate the toolbar searching
$("#grdExceptionLogs_" + vsavequeryid).jqGrid('filterToolbar', {
// JSON stringify all data from search, including search toolbar operators
stringResult: true,
// instruct the grid toolbar to show the search options
searchOperators: true
});
}
});
但是当我单击行的扩展按钮时,我的子网格没有出现。我正在使用3.7版的JQGrid。这是因为我的站点很旧,并且该版本的站点中已经实现了jqGrid的许多其他功能。我需要立即的帮助。请让我知道我要去哪里错了。