我使用jQGrid与Subgrid功能,我的键列有日期,当我点击"+" subGridRowExpanded被触发,它创建了一个Subgrid
代码工作正常时,使用其他列有数字作为关键字段,但它抛出错误时,使用日期作为关键字段ex它将有值03/18/2014
"Microsoft JScript运行时错误:语法错误,无法识别的表达式:#grid_3/18/2014"我的主网格id是grid
它工作得很好,当我使用GMMNumber作为关键,但失败时,我使用NCChitDate这是一个日期字段值在日期格式..
下面是我的代码:function LoadNCTRequestGrid() {
var cols = "";
var colmodels = "";
if (!ReqType) {
cols = ['Date', 'NC Chit Print', '2nd Scan Disposition', '%', "Items Merch'd in Place", 'Items On Request', 'Carton Completed', '%', 'Open Balance (Items On Request Carton Complete)'];
colmodels = [{ name: 'NCChitDate', index: 'NCChitDate', width: 300, key: true },
{ name: 'NCChitPrintQty', index: 'NCChitPrintQty', width: 300 },
{ name: 'SecondScanDisp', index: 'SecondScanDisp', width: 300 },
{ name: 'PercentageSecondScanDisp', index: 'PercentageSecondScanDisp', width: 180 },
{ name: 'ItemsMerchandised', index: 'ItemsMerchandised', width: 280 },
{ name: 'ItemsOnRequest', index: 'ItemsOnRequest', width: 280 },
{ name: 'CartonCompleted', index: 'CartonCompleted', width: 280 },
{ name: 'PercentageCartonCompleted', index: 'PercentageCartonCompleted', width: 280 },
{ name: 'OpenBalance', index: 'OpenBalance', width: 280 }
];
}
else{
cols = ['','GMM', 'NC Chit Print', '2nd Scan Disposition', '%', "Items Merch'd in Place", 'Items On Request', 'Carton Completed', '%', 'Open Balance (Items On Request Carton Complete)'];
colmodels = [
{ name: 'GMMNumber', index: 'GMMNumber', width: 300, key:true, hidden:true},
{ name: 'GMMDesc', index: 'GMMDesc', width: 300 },
{ name: 'NCChitPrintQty', index: 'NCChitPrintQty', width: 300 },
{ name: 'SecondScanDisp', index: 'SecondScanDisp', width: 300 },
{ name: 'PercentageSecondScanDisp', index: 'PercentageSecondScanDisp', width: 180 },
{ name: 'ItemsMerchandised', index: 'ItemsMerchandised', width: 280 },
{ name: 'ItemsOnRequest', index: 'ItemsOnRequest', width: 280 },
{ name: 'CartonCompleted', index: 'CartonCompleted', width: 280 },
{ name: 'PercentageCartonCompleted', index: 'PercentageCartonCompleted', width: 280 },
{ name: 'OpenBalance', index: 'OpenBalance', width: 280 }
];
}
$("#grid").jqGrid({
url: '@Url.Action("GetNCTRequest")',
mtype: "POST",
datatype: 'json',
colNames: cols,
colModel: colmodels,
width: 1140,
height: '100%',
rowNum: 5000,
subGrid: true,
afterInsertRow: function (rowId, aData, rowelem) {
var theGrid = $(this);
},
beforeSelectRow: function (rowid, e) {
return false;
},
loadComplete: function () {
$("tr.jqgrow:odd").css("background", "#DDDDDC");
$(".jqgrow:odd").hover(
function () {
$(this).css("background-color", "#E11A2B");
},
function (event) { $(this).css("background-color", "#DDDDDC"); }
);
},
subGridRowExpanded: function (subgridDivId, rowId) {
var subgridTableId = subgridDivId + '_t';
$("#" + subgridDivId).html("<table id='" + subgridTableId + "'></table>");
var cols = "";
var colmodels = "";
if(!ReqType){
cols = ['GMM', 'DIV', 'Dept', 'Vend', 'UPC', 'NC Chit Print', '2nd Scan Disposition', "Items Merch'd in Place", 'Items On Request', 'Carton Completed', 'Open Balance (Items On Request Carton Complete)', 'Carton ID'];
colmodels = [
{ name: 'GMMDesc', index: 'GMMDesc', width: 300 },
{ name: 'DivisionDesc', index: 'DivisionDesc', width: 300 },
{ name: 'DepartmentName', index: 'DepartmentNumber', width: 300 },
{ name: 'VendorID', index: 'VendorID', width: 100 },
{ name: 'UPCNumber', index: 'UPCNumber', width: 100 },
{ name: 'NCChitPrintQty', index: 'NCChitPrintQty', width: 300 },
{ name: 'SecondScanDisp', index: 'SecondScanDisp', width: 300 },
{ name: 'ItemsMerchandised', index: 'ItemsMerchandised', width: 280 },
{ name: 'ItemsOnRequest', index: 'ItemsOnRequest', width: 280 },
{ name: 'CartonCompleted', index: 'CartonCompleted', width: 280 },
{ name: 'OpenBalance', index: 'OpenBalance', width: 280 },
{ name: 'CartonID', index: 'CartonID', width: 100 },
{ name: 'NCChitDate', index: 'NCChitDate', width: 10, key: true, hidden : true }
]
}
else{
cols = ['Date', 'DIV', 'Dept', 'Vend', 'UPC', 'NC Chit Print', '2nd Scan Disposition', "Items Merch'd in Place", 'Items On Request', 'Carton Completed', 'Open Balance (Items On Request Carton Complete)', 'Carton ID'];
colmodels = [
{ name: 'NCChitDate', index: 'NCChitDate', width: 100},
{ name: 'DivisionDesc', index: 'DivisionDesc', width: 150 },
{ name: 'DepartmentName', index: 'DepartmentNumber', width: 200 },
{ name: 'VendorID', index: 'VendorID', width: 50 },
{ name: 'UPCNumber', index: 'UPCNumber', width: 100 },
{ name: 'NCChitPrintQty', index: 'NCChitPrintQty', width: 50 },
{ name: 'SecondScanDisp', index: 'SecondScanDisp', width: 50 },
{ name: 'ItemsMerchandised', index: 'ItemsMerchandised', width: 50 },
{ name: 'ItemsOnRequest', index: 'ItemsOnRequest', width: 100 },
{ name: 'CartonCompleted', index: 'CartonCompleted', width: 50 },
{ name: 'OpenBalance', index: 'OpenBalance', width: 50 },
{ name: 'CartonID', index: 'CartonID', width: 100 }
]
}
$("#" + jQuery.jgrid.jqID(subgridTableId)).jqGrid({
mtype: "POST",
datatype: 'json',
url: encodeURI('@Url.Action("GetnctRequestIndividualDetails")' + '?reqValue=' + rowId),
colNames: cols,
colModel: colmodels,
rowNum: 9999,
height: '100%'
});
$(".ui-icon-carat-1-sw").css("background-image", "none");
}
});
}
可以使用$.jgrid.jqID
转义:
$("#" + subgridDivId).html("<table id='" + $.jgrid.jqID(subgridTableId) + "'></table>");
或者,您可以选择另一个 id
值。例如,您可以生成id:
var subgridTableId = $.jgrid.randId() + '_t';
函数$.jgrid.randId
非常简单(见3行代码)。它生成唯一的值,可以用作id
属性。
另外,我强烈建议您使用idPrefix
(参见这里和这里)。例如,idPrefix: "s_" + rowId + "_"
值适合子网格。建议所有网格使用gridview: true
、autoencode: true
选项。选项autowidth: true
对于子网格是实用的。这个答案可能对你也有帮助。
我建议您另外将jqGrid更新到当前版本4.6.0。