Question

我正在使用primefaces的手风琴面板。在选项卡内部，我有以编程方式创建的表单。每个表单都有一个提交按钮。现在我想更改选项卡的颜色，如果已提交此选项卡的表单。那么是否可以更改一个特定选项卡的颜色，我怎样才能使其工作？

我想我必须使用这里提到的不同的样式类，但我不太确定如何使用它们。

How to highlight a primefaces tree node from backing bean

感谢任何帮助

Answer 1

您可以使用titleStyleClass标记的<p:tab>。 E.g。

<p:accordionPanel>
    <p:tab title="Step 1" titleStyleClass="#{bean.step1Completed ? 'completed' : ''}">
        ...
    </p:tab>
    <p:tab title="Step 2" titleStyleClass="#{bean.step2Completed ? 'completed' : ''}">
        ...
    </p:tab>
    <p:tab title="Step 3" titleStyleClass="#{bean.step3Completed ? 'completed' : ''}">
        ...
    </p:tab>
</p:accordionPanel>

每当条件返回completed时，这会将选项卡的CSS样式类设置为true。您可以在自己的.completed {}文件中的style.css样式类中指定所需的CSS，该文件放在/resources文件夹中并包含在<h:outputStylesheet name="style.css">中。

.completed {
    background: pink;
}

Answer 2

@BalusC的完美答案！另外，如果对您不起作用，请添加！important;。在CSS中。

.completed {
background: red !important;
}

更改手风琴面板选项卡的颜色

2 个答案: