Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Spring MVC - How to set parent div's class when there are validation errors?

Are there any ways to bind arbitrary element's css class to model bind state?

<form:form method="post" commandName="authForm" action="authenticate">
  <div id="login-error" class="control-group">
    <label>Login</label>
    <form:input path="name" />
    <span class="help-inline"><form:errors path="name" /></span>
  </div>

  <div class="control-group">
    <label>Password</label>
    <form:input path="password" />
    <span class="help-inline"><form:errors path="password" /></span>
  </div>

  <input type="submit" />
</form:form>

In this piece of code I need to manage login-error's class to control-group when there are no errors and control-group error when there are (the same idea for second control-group).

What's the common solution here?

Update

Here's what I need when there's no bind error:

<div class="control-group"> <!-- !!!!!!!!!!!! -->
  <label>Login</label>
  <form:input path="name" />
  <span class="help-inline"><form:errors path="name" /></span>
</div>

Here's what I need when there is a bind error:

<div class="control-group error"> <!-- !!!!!!!!!!!! -->
  <label>Login</label>
  <form:input path="name" />
  <span class="help-inline"><form:errors path="name" /></span>
</div>

Looking for solution.

like image 991
Andrey Agibalov Avatar asked May 14 '12 06:05

Andrey Agibalov


2 Answers

Here's the solution that just works, but I'm not sure if it's really good idea:

<%@taglib prefix="spring" uri="http://www.springframework.org/tags"%>
...
<form:form method="post" commandName="authForm" action="authenticate">
  <spring:bind path="name">
    <div class="control-group <%= status.isError() ? "error" : "" %>"
      <label>Login</label>
      <form:input path="name" />
      <form:errors path="name" cssClass="help-inline" />
    </div>    
  </spring:bind>
  ...
</form:form>
like image 177
Andrey Agibalov Avatar answered Nov 11 '22 11:11

Andrey Agibalov


I had the same problem and I solved it using jQuery.

<div class="control-group">
    <form:label path="groupCode" cssClass="control-label"><spring:message code="lookUp.groupCode"/></form:label>
    <div class="controls">
        <form:input path="groupCode"/>
        <form:errors path="groupCode">
            <form:errors path="groupCode" cssClass="help-inline"/>
            <script type="text/javascript">
                $("#groupCode").parent().parent().addClass("error");
            </script>
        </form:errors>
    </div>
</div>
like image 28
Saeid Avatar answered Nov 11 '22 11:11

Saeid