Undefined is null or not an object - Jquery validate

Question

Hello all,

I have an issue when using the jquery validate plugin with IE. I get the following error "undefined is null or not an object" when validating the form.

The error is at line 431 : " $("#signup_meeta").submit();"

$(document).ready(function() {
 $("#pseudobox").hide();
 $("#passwdbox").hide();
 $("#emailbox").hide();
 $("#sexebox").hide();
 $("#originbox").hide();
 $("#birthdaybox").hide();
 $("#countrybox").hide();
 $("#regionbox").hide();
 $("#dptbox").hide();
 $("#acceptbox").hide();

 $("#dpt").hide();

 dynamicSelectRegion(); 
 $("#fromc").change(function() {
   dynamicSelectRegion();
 });

 $('a[rel*=facebox]').facebox();

 $("#signup_meeta").validate({
  ignore : ":hidden",
  rules: {
   nickname : {
    required : true,
    minlength : 5,
    maxlength : 15,
    remote : "?q=register/CheckUsername",
    nowhitespace : true,
    nospecialcar : true
   },
   passwd : {
    required : true,
    minlength : 5
   },
   email : {
    required : true,
    email : true,
    nowhitespace : true,
    nospecialcar : true
   },
   gender : {
    required : true
   },
   origin : {
    required : true
   },
   birth_day : {
    required : true
   },
   birth_month : {
    required : true
   },
   birth_year : {
    required : true
   },
   fromc : {
    required : true
   },
   region : {
    required : true
   },
   department : {
    required: true
   },
   accept_cgu : {
    required : true
   }
  },
  messages: {
   nickname : {
    required : "Veuillez entrer votre pseudo svp",
    minlength: "Votre pseudo doit contenir au - 5 caractères",
    maxlength: "Votre pseudo doit contenir au + 15 caractères",
    remote: "Ce pseudo n'est pas disponible. Modifiez svp",
    nowhitespace: "Ce champ ne doit pas contenir d\'espace",
    nospecialcar: "Ce champ ne doit pas contenir de caractère spécial"
   },
   passwd : {
    required : "Veuillez entrer votre mot de passe svp",
    minlength: "Votre mot de passe doit contenir au - 5 caractères"
   },
   email : {
    required : "Veuillez entrer votre adresse email svp",
    nowhitespace: "Ce champ ne doit pas contenir d\'espace",
    nospecialcar: "Ce champ ne doit pas contenir de caractère spécial"
   },
   gender : {
    required : "Veuillez sélectionner votre sexe svp"
   },
   origin : {
    required : "Veuillez sélectionner votre pays d\'origine svp"
   },
   birth_day : {
    required : "  Votre jour de naissance ?"
   },
   birth_month : {
    required : "  Votre mois de naissance ?"
   },
   birth_year : {
    required : "  Votre année de naissance ?"
   },
   fromc : {
    required : "Veuillez sélectionner votre pays svp"
   },
   region : {
    required : "Veuillez sélectionner votre région svp"
   },
   department : {
    required : "Veuillez sélectionner votre département svp"
   },
   accept_cgu : {
    required : "Veuillez accepter les CGUs svp" 
   }
  },
  submitHandler: function(form) {
   **$("#signup_meeta").submit();**
   return false;
  }

 });

})

Can someone help me please ?

Best regards, Salim

Answer 1

You should call the native form.submit() method to avoid errors and an infinite loop here, like this:

form.submit();

The validation plugin, by default, adds a submit handler on the <form> element, so triggering that event in the submitHandler would cause validation to run again, pass again, rinse/repeat, and loop infinitely. If you look at the submitHandler documentation it mentions this specifically:

Use submitHandler to process something and then using the default submit. Note that "form" refers to a DOM element, this way the validation isn't triggered again.