jQuery Validate-Plugin, wie Form zu stoppen einreichen mit einem externen Handler

Question

ich ein globales Skript Formen mit jqueryvalidation zu validieren:

$("form").validate({ 
    submitHandler: function(form) { 
     $("body").append("<p>validate</p>"); 
     form.submit(); 
    } 
    }); 

In einer besonderen Form brauche ich eine andere „zweite“ Handler zu dieser Form hinzufügen :

$("#myform").submit(function(){ 
    $("body").append("<p>other handler</p>"); 
    return false; 
    }); 

Warum blockiert die return false; des zweiten Handlers das Formular nicht senden? Ich habe auch mit preventDefault und stopProparation versucht, aber es funktioniert nicht.

https://jsfiddle.net/brj7ttdn/5/

Answer 1

Kann versuchen Sie die prevent() richtig wie unten:

$(function(){ 
    $("form").submit(function(event){ 
    $("body").append("<p>other handler</p>"); 
    event.preventDefault(); 
    }); 
}); 

die Fiddle prüfen.

Answer 2

Deaktivieren Sie Ihr Button Click Event, das Formular wird auch deaktiviert. ändern

$("#myform").submit(function(e){ 

zu

$("button").click(function(e){ 

Wenn Ihr Formular durch Drücken Eintragen "ENTER", müssen Sie keypress Aktion auslösen und Aktion einreichen stoppen mit einem Skript wie:

$("input").on("keypress", function(e){ 
    var keypress; 
    if(window.event) { // IE      
     keypress= e.keyCode; 
    } else if(e.which){ // Netscape/Firefox/Opera     
     keypress= e.which; 
    } 
    if (keypress == 13) { 
     e.preventDefault(); 
    } 
}) 

Answer 3

Könnten Sie vielleicht den globalen submithandler entfernen und nur den spezifischen laufen lassen? Wie folgt aus:

$(function(){ 

$("form").validate({ 
    submitHandler: function(form) { 
    $("body").append("<p>validate</p>"); 
    form.submit(); 
    } 
}); 

$('#myform').off('submit') 

$("#myform").submit(function(e){ 
    $("body").append("<p>validate</p>"); 
    $("body").append("<p>other handler</p>"); 
    e.preventDefault(); 
    }); 
}); 

Sie würden die Validierung von den anderen Handler verlangen auch, aber das ist vielleicht nicht allzu schmerzhaft sein, machen nur einen form.valid() Anruf

Answer 4

hier ein Working Fiddle ist und der Code ist wie folgt.

$(function() { 

    $("form").validate({ 
    submitHandler: function(form) { 
     $("body").append("<p>validate</p>"); 

     if ($(form).data('has-customSubmit-event') === true) { 
     $(form).trigger('customSubmit'); // trigger your custom submit. 
     } else { 
     form.submit(); 
     } 
    } 
    }); 

    $('#myform').data('has-customSubmit-event', true); // add a pointer to say there is a custom handler for this form, 

    $("#myform").on('customSubmit', function(e) { 
    $("body").append("<p>other handler</p>");  
    //$(this).submit(); // if you want to submit this form. 
    }); 

}); 

Die Idee ist, einen Zeiger zu sagen für diese Form hinzufügen, wenn seine Gültigkeit nicht die form.submit(); dh Plugin tun einreichen, aber Ihre eigene Logik ausführen und dann entweder einreichen oder vorlegen nicht.

Der Zeiger ich im Gespräch bin, ist diese

$('#myform').data('has-customSubmit-event', true);

Jetzt im Plugin-Handler unterbreiten wir dann reichen Sie ein, wenn Scheck sagen, wenn diese Form einen benutzerdefinierten Handler hat auszuführen haben kann, sonst die bilden.

if ($(form).data('has-customSubmit-event') === true) { 
    $(form).trigger('customSubmit'); // trigger your custom submit. 
} else { 
    form.submit(); 
} 

---

Auch die Art und Weise Sie hinzufügen, die Validierung Plugin $("form").validate({.. wie diese. Was ich herausgefunden habe, war, dass das Submit-Handler-Ereignis nur für das erste Formular ausgelöst wird (Nicht sicher warum, Fiddle With Issue).

So, es zu beheben eine each() Funktion eine Schleife durch alle Formulare und das Plugin einzeln binden, Example Fiddle