jQuery plugin validator + ajax soumettant pas de travail
J'utilise le jQuery plugin validator (1.11) à partir de bassistance.de et de le soumettre via php.
Maintenant, j'ai ajouter un appel ajax dans le gestionnaire de soumission à la fin de la javacript code, mais l'appel n'est pas de travail, ni exister pour la console de firebug.
CAS 1 Si je mets de l'appel ajax au début du site, il fonctionne, mais le validateur plugin n'est pas vu plus.
CAS 2 Si j'ai mis l'appel à l'intérieur du gestionnaire de soumission, il n'existe pas et que le formulaire est soumis par php.
CAS 3 Si j'ai mis le code à la fin de la page, le formulaire de contact est toujours soumis par php.
Voici l'appel ajax:
$("#contactform").submit(function(e){
e.preventDefault();
$.ajax({
type: "POST",
url: "formfiles/submit.php",
data: $(this).serialize(),
success: function() {
$('#contactform').html("<div id='message'></div>");
$('#message').html("<h2>Your request is on the way!</h2>")
.append("<p>someone</p>")
.hide()
.fadeIn(1500, function() {
$('#message').append("<img id='checkmark' src='images/ok.png' />");
});
}
});
return false;
});
Quelqu'un sait quel est le problème?
Merci d'avance pour toute aide, de la difficulté de ma tête à ce sujet.
MODIFIER Pour mieux comprendre le problème, ici, c'est le javascript complet
$(document).ready(function(){
$("#contactform").validate();
$(".chapta").rules("add", {maxlength: 0});
var validator = $("#contactform").validate({
ignore: ":hidden",
rules: {
name: {
required: true,
minlength: 3
},
cognome: {
required: true,
minlength: 3
},
subject: {
required: true,
},
message: {
required: true,
minlength: 10
}
},
submitHandler: function(form) {
$("#contactform").submit(function(e){
e.preventDefault();
$.ajax({
type: "POST",
url: "formfiles/submit.php",
data: $(this).serialize(),
success: function() {
$('#contactform').html("<div id='message'></div>");
$('#message').html("<h2>Your request is on the way!</h2>")
.append("<p>someone</p>")
.hide()
.fadeIn(1500, function() {
$('#message').append("<img id='checkmark' src='images/ok.png' />");
});
}
});
return false;
});
},
});
});
EDIT 2
Les sélecteurs et tout le reste semble être bien.
<form action="#n" class="active" method="post" name="contactform" id="contactform">
toujours pas assez de code html... est nécessaire parce que vous êtes peut-être en utilisant les sélecteurs de mal.
veuillez voir mon 2ème edition
Le jQuery Valider plugin ne peut pas voir PHP. Rendu HTML de la forme est tout ce qui est nécessaire.
OriginalL'auteur Someone33 | 2013-03-25
Vous devez vous connecter pour publier un commentaire.
Votre
ajax
appartient à l'intérieur de lasubmitHandler
fonction de rappel de l'jQuery Valider plugin.Comme par docs,
Votre autre problème, c'est que vous êtes d'appel
.validate()
deux fois. Après, il est appelé la première fois, l'autre instance est ignoré, ainsi que toutes les règles que vous essayez de transmettre. Le.validate()
méthode est appelée UNE seule fois sur DOM prêt à initialiser le plugin sur votre formulaire.Enfin, vous n'avez pas besoin de mettre un
submit
gestionnaire dans lesubmitHandler
fonction de rappel.DÉMO: http://jsfiddle.net/nTNLD/1/
Merci @sparky,cette réponse sauver ma journée!
OriginalL'auteur Sparky
Vous avez de mettre votre code dans le document de prêt de rappel, pour être sûr que le DOM () est chargé avant.
Vous devez supprimer votre
.submit()
de lasubmitHandler
et le placer à l'extérieur de la validation de l'initialisation, mais à l'intérieur deready
. Puis à l'intérieur de lasubmitHandler
vous appeler queform.submit();
Avec
form.submit();
vous déclenchersubmit
, l'autre est alors déclenché.Ou vous placez votre
$.ajax
directement danssubmitHandler
.La façon dont vous le faites maintenant, vous avez seulement ajouter l'écouteur d'événement au moment où vous cliquez sur le bouton "soumettre". C'est en fait à la fin. Directement après que votre formulaire est soumis sans ajax.
.ready(function()
, et ça fonctionne au début du site. Mais, à la fin du site et dans le gestionnaire de soumission, il ne fonctionne pas.L'initialisation de jquery validation et le gestionnaire de soumission ont à la fois à l'intérieur du prêt de rappel. Si cela ne fonctionne pas, vous devez enregistrer le code entier.
Veuillez voir mon edit de la question
Jetez un oeil à ma mise à jour de réponse, je suis sûr que cela résout votre problème.
la forme est toujours soumises par PHP car le
submitHandler
est ignoré ainsi que tous vos autres déclaré règles & options. Vous ne pouvez pas appeler.validate()
deux fois... la deuxième est d'être ignoré. Voir ma réponse pour un travail de démonstration.OriginalL'auteur Marcel Gwerder
C'est facile. Seulement cette
OriginalL'auteur Carlos