Richard
Richard

Reputation: 13

css expression not work for primefaces

Below code not work, but it's work fine for jsf1.2. Now the framework is jsf2.0 and primefaces 3.2

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

I have another question that why

<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>

the valueChangeListener and ajax not work when we select the first null option. If we remove the required attribute it works fine. Is it conflict between required and valueChangeListener?

Upvotes: 0

Views: 2164

Answers (2)

BalusC
BalusC

Reputation: 1109635

You can use #{component} in any of the component's attributes to get hold of the concrete UIComponent instance of the current component. This resolves in case of <p:inputText> to an instance of UIInput which in turn has a boolean disabled property. So, this should do:

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

But a better practice is to define styling in a CSS file instead of straight in the markup as it eliminates duplication and maintenance headache.

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

with

.foo {
    color: #f00;
}

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

Or if you want to apply this globally on all input elements

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

with

input {
    color: #f00;
}

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

Upvotes: 1

Daniel
Daniel

Reputation: 37061

My guess that eventually you will use disabled="#{someBean.someCondition}"

and in this case you will have to use EL expression in your style too m like this

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

Dunno about the expression but are you sure that you can access this and that this.disabled really gives you the value of your disabled attribute ? (try displaying it in alert(this.disabled))

Upvotes: 0

Related Questions