I am developping a webApp in Groovy Grails Tools Suite and i am trying to use the jQuery validation plugin to validate a field in my HTML.

the problem is that even if i added the library in my project, the validator.addMethod is not recognized.

Here is the part that don't work in my .js code:

2. $( document ).ready(function() {
3. 
   
4. $.validator.addMethod("regex",function(value, element, regexp) {
5.        var re = new RegExp(regexp);
6.        return this.optional(element) || re.test(value);
7.    }, "Format invalide"
8. );
10. $("form[name='EditionForm']").validate({
11.    // Specify validation rules
12.    rules: {
13.      // The key name on the left side is the name attribute
14.      // of an input field. Validation rules are defined
15.      // on the right side
16.     ReferenceMetier:{
17.     required:true,
18.     regex:/^[0-9]{11}[A-Z]{1}$/,    
19.     },          
20.    },
21.    // Specify validation error messages
22.    messages: {
23.     ReferenceMetier:{
24.     required:"Please enter your ReferenceMetier",
25.     }
26.    },
27.    // Make sure the form is submitted to the destination defined
28.    // in the "action" attribute of the form when valid
29.    submitHandler: function(form) {
30.      form.submit();
31.    }
32.  });
33. });

and here is the part of my .html code that uses the .js :

2. <form method="post" name="EditionForm" id="EditionForm"  >
3. <div class="Separateur">
4. <b><h2>Saisie Separateur</h2></b>
5. <label id="date_recep" for="DatePicker">Date de reception</label> : <input type="text" class="DatePicker" name="DatePicker" id="DatePicker" size="30" maxlength="30"/>
6. <label id="dest" for="Destinataire">Destinataire</label> : <input type="text" name="Destinataie" id="Destinataire" placeholder="" size="30" maxlength="30"/>
7. <label id="grpdest" for="GroupeDestinataire">Groupe Destinataire</label> : <input type="text" name="GroupeDestinataie" id="GroupeDestinataire" placeholder="" size="30" maxlength="30"/>
8. <label id="refmetier" for="ReferenceMetier">Reference Metier</label> : <input type="text" name="ReferenceMetier" id="ReferenceMetier" placeholder="" size="30" maxlength="30" required/>
9. </br>
10. </br>
11. </div>
12. </form>

and now the chrome error message:

ask if i forgot something, thx for helping anyway.