jsf - 如何有条件地为表格单元格中的背景着色？

Question

我正在使用 p:dataTable (PrimeFaces) 渲染表格，我想要做的是根据单元格内容的值对单元格的背景进行着色。这与为行或列着色不同——它是单个单元格。

首先是 CSS 问题。如果我这样做:

                    <p:column headerText="xyzzy">
                        <div style="background-color: green">
                            <h:outputText value="#{rowVar.anumber}" >
                                <f:convertNumber groupingUsed="true" />
                            </h:outputText>                        
                        </div>
                    </p:column>

仅设置内容的背景颜色，而不是整个单元格。换句话说，填充仍然是默认的。

其次，我想让 style 字符串成为变量表达式。我可以向支持 bean 添加一个函数，但如何在该方法中访问表内容？这行得通吗？

<div style="#{bean.computeCSS(rowVar.number}">

编辑:

我找到了一种方法来完成条件部分，但我仍然需要 CSS 部分的帮助。我的解决方案如下:

                    <p:column headerText="xyzzy">
                        <div class="#{rowVar.anumber gt 0 ? 'colored' : ''}">
                            <h:outputText value="#{rowVar.anumber}">
                                <f:convertNumber groupingUsed="true" />
                            </h:outputText>                        
                        </div>
                    </p:column>

虽然我不喜欢迷恋 EL，但它的优点是不需要支持 bean 方法。

但是我仍然只得到背景颜色集，而不是整个单元格。

Answer 1

您也可以向行和列添加一个 css 类，用于标识单元格。 使用 dataTable 的 rowStyleClass 属性 ( example )。 如果您想为多行着色:

<p:dataTable value="#{bean.rows}" var="rowVar"
     rowStyleClass="#{rowVar.firstCol gt 0 ? 'firstColColored' : ''}
                           #{rowVar.secondCol gt 0 ? 'secondColColored' : ''}">
     <p:column styleClass="firstCol">...
     <p:column styleClass="secondCol">

CSS:

.firstColColored .firstCol {
     background: pink;
}