【问题标题】:Black,white Color of datatable row hide the row data黑、白 数据表行颜色隐藏行数据
【发布时间】:2016-09-01 10:18:14
【问题描述】:

我以这种方式使用 Primefaces 数据表: datatable 的每个对象都有保存在数据库中的属性 color 取决于此颜色,它将成为其行的颜色。 在没有选择该行的情况下为黑色行,由于字体为黑色,数据不可读。 在行白色的情况下,我选择了行,数据也不可读,因为在选择字体变为白色的情况下。

1-关于如何通过考虑第一种情况将适用于所有深色而第二种情况将适用于所有浅色来解决此问题的任何建议?

2-也可以根据一个语句中的颜色属性为整行着色而不在每列中获取此颜色的任何解决方案(style="background-color: #{lottiBean.getColor(lotto)}">)

<p:dataTable id="lottiTable" widgetVar="lottiTable" var="lotto"
                resizableColumns="true" selectionMode="single"
                selection="#{lottiBean.selectedLotto}" rowKey="#{lotto.idLotti}"
                value="#{lottiBean.allLottis}" rowsPerPageTemplate="5,10,25,50" rows="10" 
                style="padding-top:10px;padding-bottom:10px" 
                sortBy="#{lotto.dataLotto.time}" sortOrder="DESCENDING" 
                paginator="true" paginatorTemplate="{CurrentPageReport}  {FirstPageLink} {PreviousPageLink} {PageLinks} {NextPageLink} {LastPageLink} {RowsPerPageDropdown} {Exporters}">
<f:facet name="{Exporters}">
    <p:commandLink id="excel" ajax="false">
        <p:graphicImage library="images" name="excel.png" width="24" />
        <p:dataExporter type="xls" target="lottiTable" fileName="Lotti" />
    </p:commandLink>
    <p:commandLink id="pdf" ajax="false" immediate="true">
        <p:graphicImage library="images" name="pdf.png" width="24" />
        <p:dataExporter type="pdf" target="lottiTable" fileName="Lotti" />
    </p:commandLink>
</f:facet>
<p:column headerText="#{messages.label_unita_operativa}" filterBy="" style="background-color: #{lottiBean.getColor(lotto)}" >
    <h:outputText value="#{lottiBean.getUoCode(lotto)}" />
</p:column>
<p:column headerText="#{messages.label_codiceLotti}" filterBy="#{lotto.codiceLotti}"
    sortBy="#{lotto.codiceLotti}" style="background-color: #{lottiBean.getColor(lotto)}">
    <h:outputText value="#{lotto.codiceLotti}" />
</p:column>

这是我获取颜色的方法:

public String getColor(Lotti lotti) {
    String colorValue=null;
    try {
        if (lotti != null) {
            if (lotti.getCrLottiuos() != null && lotti.getCrLottiuos().iterator().hasNext())
                colorValue = lotti.getCrLottiuos().iterator().next().getIdUo().getIdColore().getCodiceColore();//GET COLOR FROM DATABASE AS HEXA VALUE EX:#FFFFF0
        }
    } catch (Exception ex) {
        colorValue = null;
        System.out.println(ex.getMessage());
    }
    return colorValue;
}

【问题讨论】:

    标签: css primefaces colors datatable styles


    【解决方案1】:

    您的需求不是很清楚,但是这里有一个解决方案,如何在p:databale 中添加一列,以显示保存在数据库中的颜色,这可能会对您有所帮助:

    <p:column headerText="coulor" >
          <div style="display: compact;" >
              <span class="ui-button-text">
                   <span 
                        style="overflow:hidden;
                        width:1em;height:1em;display:block;
                        border:solid 1px #000;text-indent:1em;
                        white-space:nowrap;
                        background-color:##{lotti.color}">
                    </span>
                </span>
            </div>
    </p:column>
    

    在为数据表的一行着色时,您可以使用rowStyleClass 重新设置一行的样式:

    rowStyleClass="#{ lotti.color == 'ff3d3d' ? 'redClass' : lotti.color == '3D46FF' ? 'bleuClass' : null }
    

    访问 primefaces 展示以了解有关如何设置行样式的更多信息:http://www.primefaces.org/showcase/ui/data/datatable/rowColor.xhtml

    【讨论】:

    • 您好,谢谢您的帮助,我的需要只是当行是黑色或任何深色时,默认情况下字体为黑色,无法读取任何数据,所以我需要关于如何制作的建议如果该行是深色的,则数据可读
    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2014-09-19
    • 1970-01-01
    • 1970-01-01
    • 2016-01-23
    • 2019-02-23
    相关资源
    最近更新 更多