Conditionally apply "styleClass" to component without rerendering

Question

I'm trying to update the styleClass of a JSF component if a certain condition is met by the set value. I can make it work by rerending the whole component which is triggered by some ajax event. However, the provided events only fire at inopportune times, i.e. when the user is still interacting with the component causing an interuption due to the redraw.

Is the a way to update the styleClass without the redraw?

Working code snippets, but with the undesired behavior:

<p:selectCheckboxMenu id="input" value="#{bean.value}">
  <f:selectItems value="#{bean.options}" />
  <f:attribute name="styleClass" value="#{bean.highlight(bean.value)}" />
  <p:ajax event="toggleSelect" update="input" />
  <p:ajax event="change" update="input" />
</p:selectCheckboxMenu>

And the backing bean:

@ManagedBean
@ViewScoped
public class Bean {

    private List<String> value;
    private Map<String, String> options;


    public String highlight(Object value) {
        return value == null || value instanceof Collection<?> && ((Collection<?>) value).isEmpty() ? "" : "ui-state-active";
    }

    /* getters & setters */
}

score 0 · Answer 1 · edited May 23 '17 at 11:43

Is the a way to update the styleClass without the redraw?

Use update @none
Call a server side method in the ajax events
In that server-side method add a Primefaces ajax callback with parameter to javascript that in your case returns e.g. a 'class'
Add an oncomplete to the ajax tags and in the oncomplete do something with the callback param: Primefaces ajax callback with parameter to javascript, e.g. finding the right component to set the class (with jquery)

Conditionally apply "styleClass" to component without rerendering

1 Answers1