我正在使用 jQGrid 进行分组。每个组标题将具有以下三种可能性之一:Pending
, Duplicate
, Not Duplicate
.
根据该文本,我想更改分组标题的背景颜色。我已经在使用了rowattr
jQGrid 的属性来更改网格行的背景颜色,但我不知道如何更改分组标题颜色。
这是我的实现rowattr
,我相信should类似于分组标题背景颜色:
gridview: true,
rowattr: function (rd) {
alert(rd.duplicateStatusName);
if (rd.duplicateStatusName === "Pending Review") {
return { "class": "css_trStatusBackground_pending" };
}
else if (rd.duplicateStatusName === "Duplicate") {
return { "class": "css_trStatusBackground_dup" };
}
else if (rd.duplicateStatusName === "Not a duplicate") {
return { "class": "css_trStatusBackground_notdup" };
}
},
这是我当前网格的屏幕截图:
我希望根据标题中的文本,深灰色标题颜色为不同的颜色(类似于我的行颜色)。
这可能吗?
目前的实施groupingRender
不允许使用某种rowattr
设置分组标题的样式。所以你必须迭代这些组groupingView.groups
,测试value
并在其中手动添加 css 类loadComplete
.
The demo演示该方法的可能实施:
相应的代码可能如下:
grouping: true,
groupingView: {
groupField: ["name"], // column name by which we group
groupColumnShow: [true],
groupCollapse: true
},
rowattr: function (rd) {
switch (rd.name) {
case "test1":
return { "class": "class1" };
case "test2":
return { "class": "class2" };
case "test3":
return { "class": "class3" };
default:
return {};
}
},
loadComplete: function () {
var i, group, cssClass, headerIdPrefix = this.id + "ghead_",
groups = $(this).jqGrid("getGridParam", "groupingView").groups,
l = groups.length;
for (i = 0; i < l; i++) {
group = groups[i];
switch (group.value) {
case "test1":
cssClass = "class1";
break;
case "test2":
cssClass = "class2";
break;
case "test3":
cssClass = "class3";
break;
default:
cssClass = "";
break;
}
// listghead_0_1
if (cssClass !== "") {
$("#" + headerIdPrefix + group.idx + "_" + i).addClass(cssClass);
}
}
}
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)