Question

是否可以更改网格中只听到一列的样式？！

sjg:gridColumn具有cssClass属性，但设置此css仅适用于列下的行，而不是列标题。

在JQGRID - Is it possible to change the background color of HTML header text in JavaScript?我的代码为：

  在您的HTML页面中
。如果要仅对一列进行更改   你可以使用setLabel方法：

$("#myGrid").jqGrid('setLabel','Price', '', {'background':'red'});

或

$("#myGrid").jqGrid('setLabel','Price', '', 'myColorClass');

但我无法使其发挥作用。

最后，由于列标题将具有唯一ID，我可以使用以下内容：

document.getElementById("gridtable_sampleColumn").style.backgroundColor = "#FF0000";

您认为有更好的方法吗？我正在寻找这样的事情：

<sjg:gridColumn name="sampleColumn" 
            cssClass="makeThisSmall" />

在我的CSS中

.makeThisSmall{
  font-size : smaller;
}

哪个不起作用，只更改行css而不是列标题。

另外，我发现gridColumn有一个formatoptions这可以做我正在寻找的事情吗？！

Answer 1

没有声明方法为特定列设置列标题的样式/类（我排除明确设置id或列名称的CSS规则的定义）。因此，您应该使用setLabel进行设置。

如果您需要更改背景颜色，则应考虑background-image也必须设置为none。此外，您不应忘记其他 CSS规则也将被应用，并且具有更具体 CSS选择器的规则将获胜。例如，由于来自font-size的以下规则，将应用列标题中的ui.jqgrid.css：

.ui-jqgrid .ui-jqgrid-view {
    font-size: 11px
}

规则中包含两个类。如果要更改具有makeThisSmall类的列的值，则应定义CSS规则，如

.ui-jqgrid .ui-jqgrid-view .makeThisSmall {
    font-size: 8px
}

或

.ui-jqgrid-view .makeThisSmall {
    font-size: 8px
}

无论如何，它至少应该像你要覆盖的CSS规则那么复杂或复杂。

以同样的方式应用background因为CSS规则也包含两个类

.ui-widget-content .ui-state-default {
    background: ...
}

因此，您还需要定义相应的深层（或更深层次）CSS角色，以便能够通过class属性覆盖它。

struts 2 jquery grid插件只改变一个列标题样式

1 个答案: