CSS表达式不适用于primefaces答案

【问题标题】：css expression not work for primefacesCSS表达式不适用于primefaces
【发布时间】：2012-06-15 00:50:45
【问题描述】：

下面的代码不起作用，但它适用于 jsf1.2。现在框架是jsf2.0和primefaces 3.2

<p:inputText id="pInputText4"  disabled="true" value="This is Input
Text" style="color:
expression((this.disabled==true)?'#0f0':'#f00');"/>

我还有一个问题，为什么

<p:selectOneMenu id="roleId" value="#{accessPage.roleId}" required="true">
   <f:selectItem itemLabel="#{msg['label.common.selecthere']}" itemValue="#{null}" />
   <f:selectItems var="code" value="#{accessPage.roleIdList}"   
       itemLabel="#{code.codeDesc}" itemValue="#{code.codeId}" />
   <f:valueChangeListener type="com.ncs.caseconnect.base.app.utils.ValueChangeCleanUtils"/>
   <p:ajax listener="#{accessPage.roleOrModuleChanged}" update="accessRight" />
</p:selectOneMenu>

当我们选择第一个 null 选项时，valueChangeListener 和 ajax 不起作用。如果我们删除所需的属性，它工作正常。 required 和 valueChangeListener 有冲突吗？

【问题讨论】：

针对h:inputTextJSF2 进行了测试似乎有效。Primefaces 未尝试过。

标签： java css jsf-2 primefaces

【解决方案1】：

您可以在任何组件的属性中使用#{component} 来获取当前组件的具体UIComponent 实例。这在 <p:inputText> 的情况下解析为 UIInput 的实例，而 UIInput 又具有 boolean disabled 属性。所以，应该这样做：

<p:inputText id="pInputText4" disabled="true" value="This is Input Text" 
    style="color: #{component.disabled ? '#0f0' : '#f00'};" />

但更好的做法是在 CSS 文件中定义样式，而不是直接在标记中定义样式，因为这样可以避免重复和维护问题。

<p:inputText id="pInputText4" disabled="true" value="This is Input Text" 
    styleClass="foo" />

与

.foo {
    color: #f00;
}

.foo[disabled] {
    color: #0f0;
}

或者如果你想在所有输入元素上全局应用这个

<p:inputText id="pInputText4" disabled="true" value="This is Input Text" />

与

input {
    color: #f00;
}

input[disabled] {
    color: #0f0;
}

【讨论】：

嗨 BalusC：为什么第一个解决方案在 css 文件中不能正常工作。我想添加颜色：#{component.disabled and component.disabled==true and component.type=='text'？ '#0f0' : '#f00'} 在 css 文件中，但它不起作用。预览在样式属性中工作正常。你能再给我一个建议吗？
#{component} 仅在组件本身内部可用，而不在 CSS 文件中。它也根本没有 type 属性。您可能对 JavaScript 感到困惑。我建议使用后一种方法。您可以使用此选择器input[type=text][disabled] {} 选择input type="text" disabled="true"。
感谢您的帮助！我还有一个关于的问题，你能帮忙看看吗？它被添加到顶部内容中。
不客气。新问题请按右上角，请勿重复使用已有问题。每个问题一个问题，请:)

【解决方案2】：

我猜你最终会使用disabled="#{someBean.someCondition}"

在这种情况下，您将不得不像这样在 style 中使用 EL 表达式

<p:inputText id="pInputText4"  disabled="#{someBean.someCondition}" value="This is Input
    Text" style="color:#{someBean.someCondition ?'#0f0':'#f00'}"/>

不知道expression，但你确定你可以访问this 并且this.disabled 真的给了你disabled 属性的值吗？（尝试显示在alert(this.disabled)）

【讨论】：