jquery.valider: Impossible de lire la propriété "type" de null

J'ai ce petit formulaire d'inscription

<h2>Please Register Your Account</h2>
<div class="form-horizontal" id="idFormRegistrazione">
<div class="form-group">
<label id="labelUsername" for="idUsername" class="col-sm-2 col-xs-2 control-label">Username*</label>
<div class="col-sm-10 col-xs-10">
<input type="text" class="form-control" id="idUsername" placeholder="Username" name="username">
</div>
</div>
<div class="form-group">
<label id="labelName" for="idName" class="col-sm-2 col-xs-2 control-label">Name</label>
<div class="col-sm-10 col-xs-10">
<input type="text" class="form-control" id="idName" placeholder="Name" name="name">
</div>
</div>
<div class="form-group">
<label id="labelSurname" for="idSurname" class="col-sm-2 col-xs-2 control-label">Surname</label>
<div class="col-sm-10 col-xs-10">
<input type="text" class="form-control" id="idSurname" placeholder="Surname" name="surname">
</div>
</div>
<div class="form-group">
<label id="labelEmail" for="idEmail" class="col-sm-2 col-xs-2 control-label">E-mail*</label>
<div class="col-sm-10 col-xs-10">
<input type="text" class="form-control" id="idEmail" placeholder="Email" name="email">
</div>
</div>
<div class="form-group">
<label id="labelPassword" for="inputPassword" class="col-sm-2 col-xs-2 control-label">Password*</label>
<div class="col-sm-10 col-xs-10">
<input type="password" class="form-control" id="inputPassword" placeholder="Password" name="password">
</div>
</div>
<div class="form-group">
<label id="labelPasswordConf" for="idPasswordConf" class="col-sm-2 col-xs-2 control-label">Repeat Password*</label>
<div class="col-sm-10 col-xs-10">
<input type="password" class="form-control" id="idPasswordConf" placeholder="Repeat Password" name="passwordConf">
</div>
</div>
<p class="text-right" style="color: #E64040;"><b>* Campi Obbligatori</b></p>
<div id="idDivErrori">
<div id="idErroriRegistrazione">
<ul></ul>
</div>
</div>
<button id="idBtnRegister" class="btn btn-lg btn-primary btn-block" type="submit">Register Me</button>

Et c'règles pour le jquery.valider plugin

<script type="text/javascript">
$(document).ready(function () {
$('#idFormRegistrazione').validate({
onsubmit: false,
onfocusout: false,
onkeyup: false,
onclick: false,
errorContainer: "#idDivErrori",
errorLabelContainer: "#idDivErrori #idErroriRegistrazione ul",
wrapper: 'li',
ignore: '',
rules: {
username: {
required: true,
},
name: {
required: false,
},
surname: {
required: false,
},
email: {
required: true,
email: true,
},
password: {
required: true,
},
passwordConf: {
required: true,
equalTo: '#idPassword'
}
},
messages: {
username: {
required: 'Username is Required'
},
email: {
required: 'Email is Required',
email:  'Email format is not valid'
},
password: {
required: 'Password is required',
},
passwordConf: {
required: 'You have to Confirm your password',
equalTo: 'Confirm your Password Please'
}   
}
});
});
function validateRegistration() {
var is_valid_form = $('#idFormRegistrazione').validate().form();    
if (is_valid_form) {            
return true;
}
else {
return false;
}
}
</script>

Mais quand je suis à l'appel de la fonction validateRegistration() j'ai l'erreur:

Ne peut pas lire de propriété nodeType', null

Vraiment je ne sais pas pourquoi. Merci de m'Aider

  • Vouliez-vous dire javascript?
  • où êtes-vous appeler validateRegistration ?
  • Je vais appeler validateRegistration() sur .cliquez sur la (les) cas de "#idBtnRegister'
  • Vous ne pouvez pas remplacer un div pour un form. Le plugin ne fonctionnera pas.
InformationsquelleAutor Alist3r | 2013-11-12
  1. 6

    Votre entrée de données, les éléments sont mal contenue à l'intérieur d'un div ("pseudo-forme")...

    <div class="form-horizontal" id="idFormRegistrazione">

    Vous DOIT joindre votre apport d'éléments au sein d'un ensemble de <form> balises.

    <form class="form-horizontal" id="idFormRegistrazione">

    La méthode pour tester le formulaire et renvoyer une valeur booléenne est .valide().

    function validateRegistration() {
var is_valid_form = $('#idFormRegistrazione').valid();    
if (is_valid_form) {            
return true;
} else {
return false;
}
}

    Devis OP commentaire:

    "Je vais appeler validateRegistration() sur .click() cas de #idBtnRegister"

    Pourquoi?

    La submitHandler capture automatiquement le fait de cliquer sur le bouton soumettre pour vous.

    $('#idFormRegistrazione').validate({
//your rules and options,
rules: {
....
},
messages: {
....
},
submitHandler: function(form) {
//optional
//only fires on a valid form
alert('form is valid');
return false;  //block normal submit action if using ajax here
},
invalidHandler: function(event, validator) {
//optional
//only fires on an invalid form
alert('form is invalid');
}
});
    • avec .valide() j'ai: Impossible d'appeler la méthode 'élément' undefined
    • vous devez utiliser un ensemble de <form></form> les balises dans l'ordre de l'utilisation de ce plugin.
    • Ok.. le problème a été le manque <form>... Mais, désolé, où ive de mettre le gestionnaire de soumission et les invalides gestionnaire?
    • les rappels aller à l'intérieur de la .validate() appel avec tout le reste. Voir mon édité réponse.
    • ok merci à vous, vraiment.
    InformationsquelleAutor Sparky
  2. 0

    Je viens de rencontré un autre exemple de cette erreur. Il était dans un <form> qui avait un <label> balise avec un attribut "name" qui est égal à l'un des domaines pour être validé. Suppression de l'attribut "name" de la <label> résolu (il ne devrait pas avoir été là de toute façon).

    InformationsquelleAutor Tom Ladek
  3. -2

    vérifier si votre formulaire a "novalidate" attribut. l'enlever si il y en a un.
    exemple:

    • Vous pouvez voir que les champs de saisie n'a pas novalidate attribut
    • NOVILDATE est l'attribut de l'élément de formulaire pas les champs de saisie
    InformationsquelleAutor Nuryagdy Mustapayev