JSF Conditional formatting for onmouseover and such attributes.

Question

Hi,

I'm trying to format a panelgrid according to a value in the backing bean.

I'm currently trying this as the value of the onmouseover attribute:

this.className=#{(actions.currentlySelectedActionButton == 0)?'actionButton actionButtonChosen':'actionButton'};

whereas the CSS looks like this: (the relevant parts):

.actionButton {
    width: 100%;
    height: 20px;
    border: thin solid #000;
    cursor:default; 
}

.actionButtonChosen {
    background-color: blue; 
}

It's not working. Anyone spotting the error would help me greatly. Thanks!

EDIT 1 Looking at the HTML Source I can't seem to find the attribute listed on the element. I am assigning the attribute as a ValueExpression from a backing bean.

The 'non-value expression' syntax that works is:

button.setOnmouseout("this.className='actionButton'");

The value expression syntax that doesn't seem to appear as an attrbute at all:

    ExpressionFactory ef = FacesContext
            .getCurrentInstance().getApplication().getExpressionFactory();
    String veString = "(#{actions.currentlySelectedActionButton} = '0')?'actionButton actionButtonChosen':'actionButton'}";

    ValueExpression ve = ef.createValueExpression(FacesContext
            .getCurrentInstance().getELContext(), veString, String.class);
    button.setValueExpression("onmouseover", ve);

Thanks Again.

Answer 1

That look like JavaScript. You're thus basically generating JavaScript code using JSF/EL. You need to verify if the result looks right (i.e. it is syntactically valid and runnable). Just open the JSF page in your favourite webbrowser, rightclick it and choose View Source and verify if it look right. What do you see? There should be logically no Java/JSF/EL code anywhere in the generated output.

Answer 2

Okay. It was a syntax issue which I found with the google chrome developer screen.

"..sen':'actionButton'}"  //<--- Redundant '}'

"ctionButton} = '0'"  //<-- '=' should be '=='

Other than that, this method works nicely.