HTML and CSS Reference
In-Depth Information
public class ErrorDisplayListener implements SystemEventListener {
@Override
public void processEvent(SystemEvent event) throws AbortProcessingException {
UIComponent component = (UIComponent) event.getSource();
if (component instanceof EditableValueHolder) {
EditableValueHolder editableValueHolder = (EditableValueHolder) component;
if (! editableValueHolder.isValid()) {
component.getAttributes().put("styleClass", "invalidInput");
} else {
component.getAttributes().put("styleClass", "");
}
}
}
@Override
public boolean isListenerForSource(Object source) {
return source instanceof UIComponent;
}
}
As shown in the previous listing, in
processEvent()
, any
EditableValueHolder
component that has a validation
error will have the
invalidInput
style attached to it. Finally, in order to apply the System event listener to input fields,
we need to register the System event listener in the faces configuration (
faces-config.xml
), as shown in Listing 4-26.
Listing 4-26.
Registering ErrorDisplayListener in the Faces Configuration File
<faces-config ...>
<application>
...
<system-event-listener>
<source-class>javax.faces.component.html.HtmlInputText</source-class>
<system-event-class>javax.faces.event.PostValidateEvent</system-event-class>
<system-event-listener-class>com.jsfprohtml5.subscriber.model.ErrorDisplayListener
</system-event-listener-class>
</system-event-listener>
</application>
</faces-config>
Using the <source-class> element forces the source of
postValidateEvent
to be (
javax.faces.component.html.
HtmlInputText
), which is the JSF input text element class. After writing and registering our custom System event
listener, we will be able to automatically see the styled input elements when we have one or more validation error(s),
as shown in Figure
4-10
.
