Question

我正在使用primefaces selectOneButton。我想在selectOneButton中制作一些按钮，取决于某些支持bean值，它们与其他按钮的风格不同。例如，selectOneButton中3个按钮的文本需要为粗体，而剩余部分的文本需要正常。

有可能吗？

Primefaces 3.2

Answer 1

这就是我的成就：

将styleClass添加到selectOneButton：

<p:selectOneButton styleClass="yourStyleClass" value="#{yourBean.yourValue}" > ...

然后在样式表中你可以看到如下所示的渲染按钮（我为每个按钮添加了一个图标 - 做你喜欢的任何事情）：

.yourStyleClass div:first-child span {
    background-image: url('logo.png') !important;
    background-position: left center;
    background-repeat: no-repeat;
    margin-left: 6px;
    padding-left: 23px;
}

.yourStyleClass div:nth-child(2) span {
    background-image: url('picture.png') !important;
    background-position: left center;
    background-repeat: no-repeat;
    margin-left: 6px;
    padding-left: 23px;
}

.yourStyleClass div:nth-child(3) span {
    background-image: url('video.png') !important;
    background-position: left center;
    background-repeat: no-repeat;
    margin-left: 6px;
    padding-left: 23px;
}

Answer 2

没有“标准”的方法来做到这一点。常见的解决方法是在您的案例中使用多个元素（SelectItem - 样式不同 - 并使用带有rendered属性的表达式来确定哪些元素可见。这适用于任何组件库，而不仅仅是primefaces。

编辑：现在已经尝试过了 - 看起来我根本无法影响选择项的样式 - 至少在页面中没有声明。可以尝试使用!important规则调整主题或使用自定义样式覆盖primefaces选择器。但你仍然无法为选择项目获得独特的造型。

请原谅我以前的信心，并将此答案视为“不，你不能”。

Answer 3

好的，我还没有测试过这个，但我很确定你能用Primefaces Request Context做到这一点。看到这个链接： RequestContext

这将允许您从辅助bean执行客户端JavaScript。

因此，确定哪些按钮需要在您的支持bean中更改，然后调用使用jquery的addClass函数的JS函数将CSS类添加到需要设置样式的按钮。

我脑子里似乎很简单，但我现在没时间测试它。

Answer 4

你可以试试Jquery !!

{{1}}

Primefaces SelectOneButton：更改单个按钮样式

4 个答案: