我对javascript，jqgrid和JSON数据相对较新。我一直在这里搜索，并设法找到相当多的方式（谢谢！）。但是在查看了所有相似的问题之后，我担心我仍然无法弄清楚我目前正在研究的网格还没有完全正确。
我可以使用ASP程序中的查询生成的JSON数据来填充网格，但如果我将网格设置为loadonce：true，因为我想在初始检索后在本地对网格数据进行排序/重新排序，我失去了＃34;单击列标题以重新排序网格数据时的所有网格数据。
我有一个名为getsalesdata.asp的程序，它以以下格式生成文本：
{
"total": "1",
"page": "1",
"records": "2",
"rows": [
{
"RowID": "1",
"ParentCustName": "ABCCompany",
"YTDSales": "11173.76",
"YTDBudget": "11789.84",
"YTDDiff": "-616.08",
"YTDDiffPct": "95",
"Sales3": "11173.76",
"Budget3": "11789.84",
"Diff3": "-616.08",
"Diff3Pct": "95",
"FYearSales": "11173.76",
"FYearBudget": "11789.84",
"FYearDiff": "-616.08",
"FYearDiffPct": "95"
},
{
"RowID": "2",
"ParentCustName": "XYZ Company",
"YTDSales": "51395.46",
"YTDBudget": "35147.52",
"YTDDiff": "16247.94",
"YTDDiffPct": "146",
"Sales3": "51395.46",
"Budget3": "43934.4",
"Diff3": "7461.06",
"Diff3Pct": "117",
"FYearSales": "51395.46",
"FYearBudget": "57114.72",
"FYearDiff": "-5719.26000000001",
"FYearDiffPct": "90"
}
]
}
我已经使用在线工具确保数据是有效的JSON字符串，而且我不仅仅缺少某些引号或其他内容，因此这似乎不是问题所在。
有人能指出我如何解决问题的正确方向吗？
我的JQGrid代码如下：
$(document).ready(function () {
jQuery("#customer_grid").jqGrid({
datatype: "json",
url: "getsalesdata.asp",
colNames: ["", "<b>Customer</b>", "<b>Sales</b>", "<b>Budget</b>", "<b>Difference</b>", "<b>% of Goal</b>", "<b>Sales + Forecast</b>", "<b>Budget</b>", "<b>Difference</b>", "<b>% of Goal</b>", "<b>Sales + Forecast</b>", "<b>Budget</b>", "<b>Difference</b>", "<b>% of Goal</b>", ""],
colModel: [
{ name: "ID", hidden: true, frozen: true, index: "ID" },
{ name: "ParentCustName", width: 225, sorttype: "text", sortable: true, frozen: true },
{ name: "YTDSales", formatter:'currency', sorttype: "number", width: 140, align: "right", sortable: true },
{ name: "YTDBudget", formatter:'currency', width: 140, sorttype: "number", align: "right", sortable: true },
{ name: "YTDDiff", formatter: 'currency', width: 140, sorttype: "number", align: "right", sortable: true,
cellattr: function (rowId, val, rawObject) {
if (parseFloat(val) < 0) {
return " class='myAlertRowClass'";
}
if (parseFloat(val) > 0) {
return " class='myGoalRowClass'";
}
}
},
{ name: "YTDDiffPct", width: 70, sorttype: "int", align: "right",
cellattr: function (rowId, val, rawObject) {
if (parseFloat(val) < 85) {
return " class='myAlertRowClass'";
}
if (parseFloat(val) > 85) {
return " class='myGoalRowClass'";
}
}
},
{ name: "Sales3", formatter:'currency', width: 140, sorttype: "number", align: "right" },
{ name: "Budget3", formatter:'currency', width: 140, sorttype: "number", align: "right" },
{ name: "Diff3", formatter: 'currency', width: 140, sorttype: "number", align: "right", sortable: true,
cellattr: function (rowId, val, rawObject) {
if (parseFloat(val) < 0) {
return " class='myAlertRowClass'";
}
if (parseFloat(val) > 0) {
return " class='myGoalRowClass'";
}
}
},
{ name: "Diff3Pct", width: 70, sorttype: "int", align: "right",
cellattr: function (rowId, val, rawObject) {
if (parseFloat(val) < 85) {
return " class='myAlertRowClass'";
}
if (parseFloat(val) > 85) {
return " class='myGoalRowClass'";
}
}
},
{ name: "FYearSales", formatter:'currency', width: 140, sorttype: "number", align: "right" },
{ name: "FYearBudget", formatter:'currency', width: 140, sorttype: "number", align: "right" },
{ name: "FYearDiff", formatter: 'currency', width: 140, sorttype: "number", align: "right", sortable: true,
cellattr: function (rowId, val, rawObject) {
if (parseFloat(val) < 0) {
return " class='myAlertRowClass'";
}
if (parseFloat(val) > 0) {
return " class='myGoalRowClass'";
}
}
},
{ name: "FYearDiffPct", width: 70, sortype: "int", align: "right",
cellattr: function (rowId, val, rawObject) {
if (parseFloat(val) < 85) {
return " class='myAlertRowClass'";
}
if (parseFloat(val) > 85) {
return " class='myGoalRowClass'";
}
}
},
{ name: "Ghost", width: 20}
],
rowNum: "records",
jsonReader: {
repeatitems: false,
id: "RowID"
},
gridview: true,
footerrow: true,
loadComplete: function(){
var $self = $(this);
sumSales = $self.jqGrid("getCol", "YTDSales", true, "sum");
sumBudget = $self.jqGrid("getCol", "YTDBudget", false, "sum");
sumDiff = $self.jqGrid("getCol", "YTDDiff", false, "sum");
sumSales3 = $self.jqGrid("getCol", "Sales3", false, "sum");
sumBudget3 = $self.jqGrid("getCol", "Budget3", false, "sum");
sumDiff3 = $self.jqGrid("getCol", "Diff3", false, "sum");
sumFYearSales = $self.jqGrid("getCol", "FYearSales", false, "sum");
sumFYearBudget = $self.jqGrid("getCol", "FYearBudget", false, "sum");
sumFYearDiff = $self.jqGrid("getCol", "FYearDiff", false, "sum");
$self.jqGrid("footerData", "set", { ParentCustName: "Grand Totals:", YTDSales: sumSales, YTDBudget: sumBudget, YTDDiff: sumDiff, Sales3: sumSales3, Budget3: sumBudget3, Diff3: sumDiff3, FYearSales: sumFYearSales, FYearBudget: sumFYearBudget, FYearDiff: sumFYearDiff });
},
altRows: true,
altclass: "myAltRowClass",
autoencode: true,
loadonce: true,
sortorder: "asc",
sortable: true,
sortname: "ParentCustName",
viewrecords: true,
emptyrecords: "No records to view...",
caption: "Customer Sales Performance Summary",
loadtext: "Loading data, please wait...",
height: "auto",
onSelectRow: function (RowID) {
var rowId = $('#customer_grid').jqGrid('getGridParam', 'selrow');
var colData = $('#customer_grid').jqGrid('getCell', rowId, 'ParentCustName');
var ParentName = colData.replace("(Tooling)", "");
var ParentStr = "SalesPerformance2New.asp?Parent=" + (ParentName);
window.location.href = ParentStr;
}
});
任何帮助将不胜感激！
答案 0 :(得分：1)
我调试了你的代码并且发现非常简单，但有一个有趣的原因：你使用rowNum: "records"，但rowNum必须有整数值。由于网格没有pager或toppager: true参数，我建议使用rowNum rowNum: 10000之类的足够大的值。
将rowNum: "records"替换为rowNum: 10000可以解决您的主要问题。
此外，您应该在代码中将;更改为,，以{}}}声明变量loadComplete，sumSales以及您使用的其他变量。代码如下：
sumBudget