JSF PrimeFaces:如何使h:inputText看起来像PrimeFaces小部件?

时间:2011-04-13 18:27:05

标签: java html css jsf primefaces

我正在使用PrimeFaces 2.2.1。我有JSF表单与常规widgetss(如h:inputText,h:selectOneMenu,h:selectBooleanCheckbox等)和PrimeFaces小部件(如p:calendar等)的组合。

PrimeFaces小部件有一个很好的皮肤/主题,常规小部件呈现为普通的HTML小部件。

是否有一种简单的方法可以使用PrimeFaces皮肤/主题获取非PrimeFaces小部件渲染?

谢谢! 抢劫

[PS。我注意到PrimeFaces 3.0将有p:inputText等等,但它还没有出来。 :(]

3 个答案:

答案 0 :(得分:2)

p:inputText在PrimeFaces 2.2 +

http://www.primefaces.org/showcase/ui/inputText.jsf

答案 1 :(得分:1)

您必须为非jsf小部件设计CSS并有条件地应用它。

<强>更新

假设有非jsf日历控件(即表面皮肤变化的组件不会起作用)

现在你可以在会话中有一些bean来存储当前的皮肤。例如说natural_orange现在您可以为您的组件设计css说natural_orange_calendar.css并将其应用为

<your component css="#{skinManager.currentSkin}_calendar.css">

答案 2 :(得分:1)

查看jsf页面的html输出。了解如何呈现primefaces小部件以及它们使用的css样式类。

Primefaces使用JQuery UI,因此类名通常以 ui -... 开头。对非主要面部小部件使用相同的类。

我的一个项目的示例。此h:dataTable标题看起来像p:dataTable

<h:column headerClass="ui-widget-header ui-widget-content ui-state-default">