jqGrid - 在数据透视表中隐藏特定的列或行
jqGrid - hide specific column or row in pivot
如果我们要隐藏该列（第 7 个月，范围：黑色边框）
或隐藏该列（2015 年，边框绿色）
是否有我们可以使用的任何解决方案或 jqGrid 选项？
jqPivot 方法没有允许您直接隐藏某些列的特殊选项，但是可以使用 beforeInitGrid 回调对 colModel 之前进行任何修改 将创建网格。唯一的问题是：必须了解 jqPivot 使用的列的确切名称转换才能编写正确的 beforeInitGrid 回调代码。所以我先描述一下 jqPivot 的一些内部结构，然后 beforeInitGrid 回调的代码就会清晰易懂。我根据示例解释问题。我建议大家阅读 the wiki article too which provides additional information about jqPivot implemented in free jqGrid 4.9.0.
首先我要提醒的是 jqPivot 获取输入数据，这些数据将根据 xDimension 和 yDimension 选项进行索引，然后计算所有项目的聚合函数相同的 x 和 y 值。聚合函数将由 aggregates 参数指定。换句话说，jqPivot 是输入数据的 "pre-processor"。它分析数据并生成新的 data 和 colModel，它们显示有关原始数据的更紧凑的信息。
要实现您的要求，需要了解 jqPivot 将使用哪些列名称来生成 colModel。此外，需要了解如何为该列获取相应的 y 值。
例如我们有以下输入数据：
var data = [{
CategoryName: "Baby", ProductName: "Baby Oil",
Price: "193.81", Quantity: "1",
sellmonth: "7", sellyear: "2011", week: "first"
}, {
CategoryName: "Mom", ProductName: "Shampoo",
Price: "93.81", Quantity: "1",
sellmonth: "12", sellyear: "2011", week: "first"
}, {
CategoryName: "none", ProductName: "beauty",
Price: "93.81", Quantity: "1",
sellmonth: "12", sellyear: "2011", week: "second"
}, {
CategoryName: "none", ProductName: "beauty",
Price: "93.81", Quantity: "1",
sellmonth: "12", sellyear: "2011", week: "third"
}, {
CategoryName: "none", ProductName: "Shampoo",
Price: "105.37", Quantity: "2",
sellmonth: "12", sellyear: "2011", week: "third"
}, {
CategoryName: "none", ProductName: "beauty",
Price: "93.81", Quantity: "1",
sellmonth: "12", sellyear: "2015", week: "second"
}];
我们使用 jqPivot 选项
$("#pvtCrewAttendance").jqGrid("jqPivot",
data,
{
footerTotals: true,
footerAggregator: "sum",
totals: true,
totalHeader: "Grand Total",
totalText: "<span style='font-style: italic'>Grand {0} {1}</span>",
xDimension: [
{ dataName: "CategoryName", label: "Category Name", sortorder: "desc" },
{ dataName: "ProductName", label: "Product Name", footerText: "Total:" }
],
yDimension: [
{ dataName: "sellyear", sorttype: "integer", totalHeader: "Total in {0}" },
{ dataName: "sellmonth", sorttype: "integer" }//,
//{ dataName: "week" }
],
aggregates: [
{ member: "Price", aggregator: "sum", summaryType: "sum", label: "{1}" },
{ member: "Quantity", aggregator: "sum", summaryType: "sum", label: "{1}" }
]
},
{/* jqGrid options ...*/});
生成的枢轴网格将显示在 the demo:
以上选项意味着输入数据构建x-值的CategoryName和ProductName属性的qnique值-网格的第一行。这是
[["Baby", "Baby Oil"], ["Mom", "Shampoo"], ["none", "beauty"], ["none", "Shampoo"]]
上面的数组是xIndex。同样，唯一的 y 值是
[["2011", "7"], ["2011", "12"], ["2015", "12"]]
这些值构建了 colModel 的列。如果在某些 yDimension 中使用 totalHeader、totalHeader、totalText 或 totals: true 属性，则将包括具有该组总和的其他列。在上例中使用 totalHeader 代替 dataName: "sellyear"。这意味着将在具有 sellyear“2011”和“2015”的列末尾插入另外两列同时包含 aggregates（按 Price 求和并按 Quantity 求和） ".
网格列的第一个名称将是 "x0" 和 "x1"（对应于 xDimension 中的项目数）。然后是名称以 y 开头并以 a0 和 a1 结尾的列（对应于 aggregates 中的项目数）。最后两个 "total" 列的名称为 "ta0" 和 "ta1"（对应于 aggregates 中的项目数）。如果 aggregates 仅包含一个元素，则后缀（结尾）a0 和 a1 将在以 y 或 t 开头的列中丢失。分组总计列的名称以 y 开头，中间有 t，末尾有 a（如 y1t0a0）。我在上面的例子中包含了一个关于列名的例子
希望大家能看到我用红色写的列名。这是所有 14 列的 name 值：x0、x1、y0a0、y0a1、y1a0、y1a1、y1t0a0, y1t0a1, y2a0, y2a1, y2t0a0, y2t0a1, ta0, ta1.
现在重要的是要提到 jqPivot 包括 xIndex 和 yIndex 用于在内部构建枢轴 table。确切地说，可以获取 jqGrid 的 pivotOptions 参数 并检查 xIndex.items 和 yIndex.items 属性。人们会看到我在上面包含的项目数组。
现在终于有了足够的信息来理解 the demo 中使用的以下代码，它隐藏了您询问的列：
该演示使用以下 beforeInitGrid 隐藏了所需的列：
beforeInitGrid: function () {
var $self = $(this), p = $self.jqGrid("getGridParam"),
yItems = p.pivotOptions.yIndex.items, matches, iy, y,
colModel = p.colModel, i, cm, l = colModel.length, cmName;
for (i = 0; i < l; i++) {
cm = colModel[i];
cmName = cm.name;
if (cmName.charAt(0) === "y") { // x, y, t
// aggregation column
matches = /^([x|y])(\d+)(t(\d+))?(a)?(\d+)/.exec(cmName);
if (matches !== null && matches.length > 1) {
// matches[2] - iy - index if y item
// matches[4] - undefined or total group index
// matches[6] - ia - aggregation index
iy = parseInt(matches[2], 10);
y = yItems[iy];
if (y != null && (y[0] === "2015" || (y[0] === "2011" && y[1] === "7"))) {
cm.hidden = true;
}
}
}
}
}
如果我们要隐藏该列（第 7 个月，范围：黑色边框）
或隐藏该列（2015 年，边框绿色）
是否有我们可以使用的任何解决方案或 jqGrid 选项？
jqPivot 方法没有允许您直接隐藏某些列的特殊选项，但是可以使用 beforeInitGrid 回调对 colModel 之前进行任何修改 将创建网格。唯一的问题是：必须了解 jqPivot 使用的列的确切名称转换才能编写正确的 beforeInitGrid 回调代码。所以我先描述一下 jqPivot 的一些内部结构，然后 beforeInitGrid 回调的代码就会清晰易懂。我根据示例解释问题。我建议大家阅读 the wiki article too which provides additional information about jqPivot implemented in free jqGrid 4.9.0.
首先我要提醒的是 jqPivot 获取输入数据，这些数据将根据 xDimension 和 yDimension 选项进行索引，然后计算所有项目的聚合函数相同的 x 和 y 值。聚合函数将由 aggregates 参数指定。换句话说，jqPivot 是输入数据的 "pre-processor"。它分析数据并生成新的 data 和 colModel，它们显示有关原始数据的更紧凑的信息。
要实现您的要求，需要了解 jqPivot 将使用哪些列名称来生成 colModel。此外，需要了解如何为该列获取相应的 y 值。
例如我们有以下输入数据：
var data = [{
CategoryName: "Baby", ProductName: "Baby Oil",
Price: "193.81", Quantity: "1",
sellmonth: "7", sellyear: "2011", week: "first"
}, {
CategoryName: "Mom", ProductName: "Shampoo",
Price: "93.81", Quantity: "1",
sellmonth: "12", sellyear: "2011", week: "first"
}, {
CategoryName: "none", ProductName: "beauty",
Price: "93.81", Quantity: "1",
sellmonth: "12", sellyear: "2011", week: "second"
}, {
CategoryName: "none", ProductName: "beauty",
Price: "93.81", Quantity: "1",
sellmonth: "12", sellyear: "2011", week: "third"
}, {
CategoryName: "none", ProductName: "Shampoo",
Price: "105.37", Quantity: "2",
sellmonth: "12", sellyear: "2011", week: "third"
}, {
CategoryName: "none", ProductName: "beauty",
Price: "93.81", Quantity: "1",
sellmonth: "12", sellyear: "2015", week: "second"
}];
我们使用 jqPivot 选项
$("#pvtCrewAttendance").jqGrid("jqPivot",
data,
{
footerTotals: true,
footerAggregator: "sum",
totals: true,
totalHeader: "Grand Total",
totalText: "<span style='font-style: italic'>Grand {0} {1}</span>",
xDimension: [
{ dataName: "CategoryName", label: "Category Name", sortorder: "desc" },
{ dataName: "ProductName", label: "Product Name", footerText: "Total:" }
],
yDimension: [
{ dataName: "sellyear", sorttype: "integer", totalHeader: "Total in {0}" },
{ dataName: "sellmonth", sorttype: "integer" }//,
//{ dataName: "week" }
],
aggregates: [
{ member: "Price", aggregator: "sum", summaryType: "sum", label: "{1}" },
{ member: "Quantity", aggregator: "sum", summaryType: "sum", label: "{1}" }
]
},
{/* jqGrid options ...*/});
生成的枢轴网格将显示在 the demo:
以上选项意味着输入数据构建x-值的CategoryName和ProductName属性的qnique值-网格的第一行。这是
[["Baby", "Baby Oil"], ["Mom", "Shampoo"], ["none", "beauty"], ["none", "Shampoo"]]
上面的数组是xIndex。同样，唯一的 y 值是
[["2011", "7"], ["2011", "12"], ["2015", "12"]]
这些值构建了 colModel 的列。如果在某些 yDimension 中使用 totalHeader、totalHeader、totalText 或 totals: true 属性，则将包括具有该组总和的其他列。在上例中使用 totalHeader 代替 dataName: "sellyear"。这意味着将在具有 sellyear“2011”和“2015”的列末尾插入另外两列同时包含 aggregates（按 Price 求和并按 Quantity 求和） ".
网格列的第一个名称将是 "x0" 和 "x1"（对应于 xDimension 中的项目数）。然后是名称以 y 开头并以 a0 和 a1 结尾的列（对应于 aggregates 中的项目数）。最后两个 "total" 列的名称为 "ta0" 和 "ta1"（对应于 aggregates 中的项目数）。如果 aggregates 仅包含一个元素，则后缀（结尾）a0 和 a1 将在以 y 或 t 开头的列中丢失。分组总计列的名称以 y 开头，中间有 t，末尾有 a（如 y1t0a0）。我在上面的例子中包含了一个关于列名的例子
希望大家能看到我用红色写的列名。这是所有 14 列的 name 值：x0、x1、y0a0、y0a1、y1a0、y1a1、y1t0a0, y1t0a1, y2a0, y2a1, y2t0a0, y2t0a1, ta0, ta1.
现在重要的是要提到 jqPivot 包括 xIndex 和 yIndex 用于在内部构建枢轴 table。确切地说，可以获取 jqGrid 的 pivotOptions 参数 并检查 xIndex.items 和 yIndex.items 属性。人们会看到我在上面包含的项目数组。
现在终于有了足够的信息来理解 the demo 中使用的以下代码，它隐藏了您询问的列：
该演示使用以下 beforeInitGrid 隐藏了所需的列：
beforeInitGrid: function () {
var $self = $(this), p = $self.jqGrid("getGridParam"),
yItems = p.pivotOptions.yIndex.items, matches, iy, y,
colModel = p.colModel, i, cm, l = colModel.length, cmName;
for (i = 0; i < l; i++) {
cm = colModel[i];
cmName = cm.name;
if (cmName.charAt(0) === "y") { // x, y, t
// aggregation column
matches = /^([x|y])(\d+)(t(\d+))?(a)?(\d+)/.exec(cmName);
if (matches !== null && matches.length > 1) {
// matches[2] - iy - index if y item
// matches[4] - undefined or total group index
// matches[6] - ia - aggregation index
iy = parseInt(matches[2], 10);
y = yItems[iy];
if (y != null && (y[0] === "2015" || (y[0] === "2011" && y[1] === "7"))) {
cm.hidden = true;
}
}
}
}
}