spring mvc - Why jquery validate is not working? -

spring mvc - Why jquery validate is not working? -

im trying validate form add together new user using spring mvc :p. had server side validations working via spring custom validators. client side validation allowing form submitted. how im doing it:

including javascript files:

<script src="resources/js/jquery-1.8.3.min.js" type="text/javascript"></script> <script src="resources/js/jquery.colorbox-min.js" type="text/javascript"></script> <script src="resources/js/jquery.validate.min.js" type="text/javascript"></script> <script src="resources/js/additional-methods.min.js" type="text/javascript"></script>

the form before spring send browser:

<c:url value="/adduser" var="action"/> <form:form method="post" action="${action}" commandname="user" id="adduserform"> <tr> <td><form:label path="username"><spring:message code="user.form.username"/></form:label></td> <td><form:input path="username" maxlength="15"/></td> <td><form:errors path="username"/>${duplicated}</td> </tr> <tr> <td><form:label path="password"><spring:message code="user.form.password"/></form:label></td> <td><form:password path="password" maxlength="20"/></td> <td><form:errors path="password"/>${policymessage}</td> </tr> <tr> <td><form:label path="confirmpassword"><spring:message code="user.form.password2"/></form:label></td> <td><form:password path="confirmpassword" maxlength="20"/></td> </tr> <tr> <td><form:label path="description"><spring:message code="user.form.description"/></form:label></td> <td><form:input path="description"/></td> <td><form:errors path="description"/></td> </tr> <tr> <td><form:label path="role"><spring:message code="user.form.roles"/></form:label></td> <td><form:select path="role" items="${roleslist}"/></td> </tr> <tr> <td><form:label path="blocked"><spring:message code="user.form.blocked"/></form:label></td> <td><form:checkbox path="blocked" value="false"/></td> </tr> <tr> <td><form:label path="changepasswordatlogon"><spring:message code="user.form.changepasswordatlogon"/></form:label></td> <td><form:checkbox path="changepasswordatlogon" value="false"/></td> </tr> <tr> <td colspan="2"> <input type="submit" name="submit" value="<spring:message code="user.form.submit"/>"/> </td> </tr> </form:form> </table> </form>

the form in browser:

<form id="adduserform" action="/adduser" method="post"> <tr> <td><label for="username">username</label></td> <td><input id="username" name="username" type="text" value="" maxlength="15"/></td> <td></td> </tr> <tr> <td><label for="password">password</label></td> <td><input id="password" name="password" type="password" value="" maxlength="20"/></td> <td></td> </tr> <tr> <td><label for="confirmpassword">confirm password</label></td> <td><input id="confirmpassword" name="confirmpassword" type="password" value="" maxlength="20"/></td> </tr> <tr> <td><label for="description">description</label></td> <td><input id="description" name="description" type="text" value=""/></td> <td></td> </tr> <tr> <td><label for="role">user type</label></td> <td><select id="role" name="role"><option value="role_admin">administrator</option><option value="role_user">normal user</option></select></td> </tr> <tr> <td><label for="blocked">blocked</label></td> <td><input id="blocked1" name="blocked" type="checkbox" value="true"/><input type="hidden" name="_blocked" value="on"/></td> </tr> <tr> <td><label for="changepasswordatlogon">change password @ logon</label></td> <td><input id="changepasswordatlogon1" name="changepasswordatlogon" type="checkbox" value="true"/><input type="hidden" name="_changepasswordatlogon" value="on"/></td> </tr> <tr> <td colspan="2"> <input type="submit" name="submit" value="submit"/> </td> </tr> </form>

the validation settings below form. im testing theres validation first field:

$(document).ready(function () { $("#adduserform").validate( { rules: { username: { required: true } }, messages: { username: { required: "f** working" } } }); });

your html invalid, therefore, form invalid.

<form id="adduserform" action="/adduser" method="post"> <tr> ....

you cannot perchance have <form> tag parent of <tr> element. <table>, <thead>, <tbody> or <tfoot> elements can parent of <tr> elements.

see: https://developer.mozilla.org/en-us/docs/web/html/element/tr

note: bad markup likely not root problem exact code working in jsfiddle. however, i've tested in 1 browser , until prepare invalid html, results may not cross-browser compatible.

demo: http://jsfiddle.net/dby055z9/

spring-mvc jquery-validate