How can I display an icon, instead of text string, as a validation prompt?

Question

My validate method inside my custom validator is like this:
public void validate(FacesContext context, UIComponent component, Object value) {
  Pattern datePattern = Pattern.compile("(\\d{2})/(\\d{2})/(\\d{4})");
  Matcher dateMatcher = datePattern.matcher((String)value);
  if(!dateMatcher.find()){
    ((UIInput)component).setValid(false);
    FacesMessage message = new FacesMessage();
    String msg = "[" + value + "] invalid date";
    message.setDetail(msg);
    context.addMessage(component.getClientId(context), message);
    FacesMessage facesMsg = new FacesMessage(FacesMessage.SEVERITY_FATAL, "xx", "msg");
    throw new ValidatorException(facesMsg);
}My JSP has this:
<h:inputText id="test" value="#{projecthandler.test}">
<f:validator validatorId="DateValidator" />
</h:inputText>
<h:message id="testErrorMessage" for="test"/>The <h:message> tag will kick in if the user has invalid data in the <h:inputText> field and clicks submit.
When the page is regenerated, the user will see a text string reflecting what the issue is.
However, instead of this, I would like to display an icon consisting of a red circle with an exclamation point.
The user is supposed to click on the icon if they want more information. By clicking on the icon,
the user will see a message box, with a description of the error.
This is our standard for applications. I'm trying to put together a demo showing how an existing application
would work in JSF, so I won't be able to talk others into using JSF, unless I can get the validation to display an
icon instead of text.
Edited by: Kazan on Mar 18, 2009 9:31 AM
Edited by: Kazan on Mar 18, 2009 9:33 AM
Edited by: Kazan on Mar 18, 2009 9:36 AM

Answer 1

OK, I noticed a bug in my validate method. This is updated to fix the bug, and to include the recomendation about background-image:
  public void validate(FacesContext context, UIComponent component, Object value) {
    System.out.println("DateValidator.test.1");
    Pattern datePattern = Pattern.compile("(\\d{2})/(\\d{2})/(\\d{4})");
    Matcher dateMatcher = datePattern.matcher((String)value);
    System.out.println("DateValidator.test.1");
    if(!dateMatcher.find()){
      ((UIInput)component).setValid(false);
      FacesMessage message = new FacesMessage();
      String msg = "<span style='background-image: url(/error.gif)'/>";
      message.setDetail(msg);
      message.setSeverity(FacesMessage.SEVERITY_FATAL);
      context.addMessage(component.getClientId(context), message);
      throw new ValidatorException(message);
  }When I run this, the litteral string of "<span style='background-image: url(/error.gif)'/>" is printed as the message. It does not interpret this as a span tag with an image url.
Can someone tell me what's going on?