2012-01-24 40 views
2

我想在文本字段旁边显示错误消息。在字段旁边显示JSF验证错误

我能够显示错误消息,但所有的错误消息,马上就来......

<h:form id="LoginForm"> 
     <table> 
      <tr> 
       <td colspan="4" id="login"> 
        <h2 style="border-bottom: 1px solid #CCCCCC;">Login</h2> 
        <tr> 
         <td class="label"> 
          <h:outputLabel for="email" value="Login Email:"></h:outputLabel> 
         </td> 
         <td class="field"> 
          <h:inputText id="email" size="20" maxlength="70" required="true" requiredMessage="Please enter your email,eg:[email protected]" value="#{loginController.selected1.email}"> <f:validateLength maximum="70"></f:validateLength></h:inputText> 
         </td> 
        </tr> 
        <tr> 
         <td class="label"> 
          <h:outputLabel for="password" value="Password:"></h:outputLabel> 
         </td> 
         <td class="field"> 
          <h:inputSecret id="password" size="20" maxlength="50" required="true" requiredMessage="Please confirm your password" value="#{loginController.selected1.password}"><f:validateLength minimum="6" maximum="50"></h:inputSecret> 
         </td> 
        </tr> 
       </td> 
      </tr> 
       <tr> 
        <td> 
         <h:commandButton value="Login" type="submit" action="#{loginController.checkValidUser()}"></h:commandButton> 
        </td> 
       </tr> 
     </table> 

    </h:form> 

如何修改代码来显示文本字段旁边的错误信息?

回答

2

只需将<h:message>放在需要看到它的地方。例如。

<tr> 
    <td class="label"> 
     <h:outputLabel for="email" value="Login Email:"></h:outputLabel> 
    </td> 
    <td class="field"> 
     <h:inputText id="email" size="20" maxlength="70" required="true" requiredMessage="Please enter your email,eg:[email protected]" value="#{loginController.selected1.email}"> <f:validateLength maximum="70"></f:validateLength></h:inputText> 
     <h:message for="email" /> 
    </td> 
</tr> 

<tr> 
    <td class="label"> 
     <h:outputLabel for="email" value="Login Email:"></h:outputLabel> 
    </td> 
    <td class="field"> 
     <h:inputText id="email" size="20" maxlength="70" required="true" requiredMessage="Please enter your email,eg:[email protected]" value="#{loginController.selected1.email}"> <f:validateLength maximum="70"></f:validateLength></h:inputText> 
    </td> 
    <td class="message"> 
     <h:message for="email" /> 
    </td> 
</tr> 

无关的具体问题,我建议看看<h:panelGrid>。它最大限度地减少了丑陋的HTML表格样板。你的代码最终会如下结束:

<h:form id="LoginForm"> 
    <h2>Login</h2> 
    <h:panelGrid columns="3" columnClasses="label,field,message"> 
     <h:outputLabel for="email" value="Login Email:" /> 
     <h:inputText id="email" value="#{loginController.selected1.email}" size="20" maxlength="70" required="true" requiredMessage="Please enter your email,eg:[email protected]"> 
      <f:validateLength maximum="70" /> 
     </h:inputText> 
     <h:message for="email" /> 

     <h:outputLabel for="password" value="Password:" /> 
     <h:inputSecret id="password" value="#{loginController.selected1.password}" size="20" maxlength="50" required="true" requiredMessage="Please confirm your password"> 
      <f:validateLength minimum="6" maximum="50" /> 
     </h:inputSecret> 
     <h:message for="password" /> 

     <h:panelGroup /> 
     <h:commandButton value="Login" action="#{loginController.checkValidUser()}" /> 
     <h:panelGroup /> 
    </h:panelGrid> 
</h:form> 
+0

你是否推荐使用hpanelgrid或使用css进行布局? –

+0

@Koray:这对于这个问题是不重要的,也是没有建设性的。请尝试使用聊天框或讨论论坛。请注意,CSS是客户端事务,而''是为客户端生成HTML'

'的服务器端组件。所以,你的问题最好改为“你推荐使用表格还是CSS来布局?”。因此JSF与这个问题完全无关。它将适用于每一个生成一堆HTML的服务器端语言/框架,比如JSP,ASP,PHP等。 – BalusC

相关问题