1

假设我有一个要验证的用户名，在这种情况下，当验证失败以及错误消息时，我需要以红色显示用户名 outputText 和用户名 inputText 字段。

我试图将所有这些绑定在一个面板组中，以便如果验证失败，所有字段都会受到影响。但简单地放置 panelgroup 是行不通的。

我的支持 bean 验证器

public void emailValidate(FacesContext context,
        UIComponent componentToValidate,
        Object value)
        throws ValidatorException {


    String email = value.toString();


    if (!Validator.isEmailAddress(email))
    {
        FacesMessage message =
                new FacesMessage(FacesMessage.SEVERITY_ERROR,"Email","Please enter valid email address");
                throw new ValidatorException(message);
    }


}

我的 jsf

<h:panelGroup>
<h:outputText value="Email"/>
<h:message for="emailInput/>
<h:inputText id="emailInput" value="#{mybean.email}" validator="#{mybean.emailValidate}"/>
</h:panelGroup>
4

2 回答 2

10

binding通过属性将输入组件绑定到视图。它将作为UIInputEL 中的组件引用可用，以便您可以UIInput#isValid()在styleClass属性中使用。

<h:outputLabel for="emailInput" value="Email" 
    styleClass="#{emailInput.valid ? '' : 'error'}" />

<h:inputText id="emailInput" binding="#{emailInput}" ... 
    styleClass="#{emailInput.valid ? '' : 'error'}" />

（请注意，我将您的标签固定为真正的标签；另请注意，您根本不需要按照 cubbuk 的回答所建议的创建一些 bean 属性）

是的，这可能会在视图中产生相当多的非DRY样板代码。您可以使用阶段侦听器或系统事件侦听器将其抽象出来。您还可以使用透明地完成所有工作的OmniFaces <o:highlight>组件。另请参阅现场演示。

于 2013-01-22T11:50:50.273 回答
1

您需要一个字段来表示支持 bean 中的验证失败。根据该验证字段的条件，您可以更改 uiComponents 的 css，如下所示。

public void emailValidate(FacesContext context,
                UIComponent componentToValidate,
                Object value)
                throws ValidatorException
    {
       String email = value.toString();
       if (!Validator.isEmailAddress(email))
            {
                FacesMessage message =
                        new FacesMessage(FacesMessage.SEVERITY_ERROR, "Email", "Please enter valid email address");
                validationFailed = true;
                throw new ValidatorException(message);
            }
    }

public Boolean getValidationFailed()
{
    return validationFailed;
}

<style>
   .errorClass
   {
       background-color: red;
   }
   </style>
   <h:panelGroup>
      <h:outputText value="Email" styleClass="#{ozetPageBean.validationFailed ? 'errorClass' : ''}"/>
      <h:message for="emailInput"/>
      <h:inputText id="emailInput" 
                   value="#{ozetPageBean.email}" 
                   validator="#{ozetPageBean.emailValidate}"
                   styleClass="#{ozetPageBean.validationFailed ? 'errorClass' : ''}"/>
   </h:panelGroup>
于 2013-01-22T10:16:09.963 回答