title: Show JSF validation error next to the fields
body: <p>I want to display the error messages beside the text fields.</p>
  
  <p>I am able to show the error message but all the error messages come at once...</p>
  
  <pre><code>&lt;h:form id="LoginForm"&gt;
          &lt;table&gt;
              &lt;tr&gt;
                  &lt;td colspan="4" id="login"&gt;
                      &lt;h2 style="border-bottom: 1px solid #CCCCCC;"&gt;Login&lt;/h2&gt;
                      &lt;tr&gt;
                          &lt;td class="label"&gt; 
                              &lt;h:outputLabel for="email" value="Login Email:"&gt;&lt;/h:outputLabel&gt;
                          &lt;/td&gt;
                          &lt;td class="field"&gt;
                              &lt;h:inputText id="email"  size="20" maxlength="70" required="true" requiredMessage="Please enter your email,eg:yourid@domain.com" value="#{loginController.selected1.email}"&gt; &lt;f:validateLength maximum="70"&gt;&lt;/f:validateLength&gt;&lt;/h:inputText&gt;
                          &lt;/td&gt;
                      &lt;/tr&gt;
                      &lt;tr&gt;
                          &lt;td class="label"&gt;
                              &lt;h:outputLabel for="password" value="Password:"&gt;&lt;/h:outputLabel&gt;
                          &lt;/td&gt;
                          &lt;td class="field"&gt;
                              &lt;h:inputSecret id="password"  size="20" maxlength="50" required="true" requiredMessage="Please confirm your password" value="#{loginController.selected1.password}"&gt;&lt;f:validateLength minimum="6" maximum="50"&gt;&lt;/h:inputSecret&gt;
                          &lt;/td&gt;
                      &lt;/tr&gt;
                  &lt;/td&gt;
              &lt;/tr&gt;
                  &lt;tr&gt;
                      &lt;td&gt;
                          &lt;h:commandButton value="Login" type="submit" action="#{loginController.checkValidUser()}"&gt;&lt;/h:commandButton&gt;
                      &lt;/td&gt;
                  &lt;/tr&gt;
          &lt;/table&gt;
  
      &lt;/h:form&gt;
  </code></pre>
  
  <p>How to modify the code to show error messages beside the text fields?</p>