Wordpress- und Ajax-Formular, Warum sendet mein Formular vor dem Ausführen meiner benutzerdefinierten Validierungsfunktion?

Question

Ich versuche Ajax meine Postleitzahl zu überprüfen, verwenden Sie eine benutzerdefinierte Funktion isValid(), und ändern Sie die Formularaktion vor dem Absenden des Formulars.

Derzeit wenn die Postleitzahl in einem der zipCode Arrays gefunden wird:

var zipPriorityAcura = [ 23320, 23321, 23322, 23323, 23324, 23325, 23434, 23435, 23463, 23464, 23502, 23503, 23504, 23505, 23507, 23508, 23509, 23510, 23511, 23513, 23517, 23518, 23523, 23529, 23701, 23702, 23703, 23704, 23707, 23708, 23709, 27921, 27958, 27976 ]; var zipHallAcuraNewportNews = [ 123 ]; var zipHallAcuraVirginiaBeach = [ 456 ];

Es wird auf die richtige Form Verarbeitungsdatei ändern. Dann reichen Sie richtig ein.

Wenn jedoch die eingegebene Postleitzahl in einem der Arrays nicht gefunden wird, sollte ein Popup ausgelöst werden, mit dem der Benutzer auswählen kann, wohin das Formular gesendet werden soll. Anschließend wird das Formular an den ausgewählten Speicherort gesendet.

Wenn die eingegebene Postleitzahl nicht in einem Array ist, wird das Formular zuerst gesendet und dann das Popup geöffnet, um das Formular an einen vom Benutzer ausgewählten Ort zu senden.

Offensichtlich funktioniert das nicht.

Hier ist meine Ajax:

$("#leadForm").validate({ 
rules: { 
    firstName: "required", 
    lastName: "required", 
    email: { 
    required: true, 
    email: true 
    }, 
    zipCode: "required", 
    phone: "required" 

}, // end rules 
messages: { 
    firstName: "Please enter your first name", 
    lastName: "Please enter your last name", 
    email: "Please enter a valid email address", 
    zipCode: "Please enter a valid zip code", 
    phone: "Please enter a valid phone number" 
}, // end messages 

submitHandler: function(form) { 

    var form = $("#leadForm"); // contact form 
    var submitButton = $("#leadForm button"); // submit button 
    var message = $('#ajaxMessage'); // alert div for show alert message 

    isValid(); 

$.ajax({ 
    url: $(form).attr('action'), // form action url 
    type: 'POST', // form submit method get/post 
    data: form.serialize(), // serialize form data 
    beforeSend: function() { 
     message.fadeOut(); 
     submitButton.html('Sending....'); // change submit button text 
    }, 
    success: function(data) { 
     message.html(data.message).fadeIn(); // fade in response data 
     form.trigger('reset'); // reset form 
     $('#contact-dealer fieldset input').removeClass("valid error"); 
     submitButton.html('Contact Your Local Acura Dealer'); // reset submit button text 
     message.html(data.message).delay(1400).fadeOut(); // fade in response data 
    }, 
    error: function(e) { 
     console.log(e); 
    } 
    }); 
    } // end submit handler 
}); //end validate 

Hier ist die Validierungsfunktion, die die Eingabe zipcode prüft:

//isValid Zipcode Validation for ASA 
    function isValid(){ 

     var zipCode = parseInt($("form[name='leadForm'] input[name='zipCode']").val(), 10); 
     var $leadForm = $("form[name='leadForm']"); 


     var calculatePriorityAcura = $.inArray(zipCode, zipPriorityAcura); 


     var calculateHallAcuraNewportNews = $.inArray(zipCode, zipHallAcuraNewportNews); 


     var calculateHallAcuraVirginiaBeach = $.inArray(zipCode, zipHallAcuraVirginiaBeach); 


      if (calculatePriorityAcura > -1) { 
      $leadForm.attr('action', 'http://cdn.moranautoads.com/hrad/wp-content/themes/hrad-2016/forms/PriorityAcura.php'); 
      ga('send', 'event', 'Form Submission', 'Priority Acura' , 'Sidebar Form'); 
      return true; 
     } 
      else if (calculateHallAcuraNewportNews > -1) { 
      $leadForm.attr('action', 'http://cdn.moranautoads.com/hrad/wp-content/themes/hrad-2016/forms/HallAcuraNewportNews.php'); 
      ga('send', 'event', 'Form Submission', 'Hall Acura Newport News' , 'Sidebar Form'); 
      return true; 
     } 
      else if (calculateHallAcuraVirginiaBeach > -1) { 
      $leadForm.attr('action', 'http://cdn.moranautoads.com/hrad/wp-content/themes/hrad-2016/forms/HallAcuraVirginiaBeach.php'); 
      ga('send', 'event', 'Form Submission', 'Hall Acura Virginia Beach' , 'Sidebar Form'); 
      return true; 
     } 
      else { 
      $('#contact-lead.overlay').show(); 
      setTimeout(function(){ 
       $('#contact-lead.overlay .zipcode-modal').addClass('animated fadeInUp').show(); 
      }, 200); 
      return false; 
     } 
    } 

ich jede Hilfe dankbar an alle, ich bin schon jetzt verloren. Vielen Dank

Answer 1

Versuchen Sie, den Submit-Handler zu ändern, um das Standardverhalten der Schaltfläche zum Senden zu verhindern.

submitHandler: function(form, event) { 

     //Your logic here 
     if(isValid()) 
     { 
     $.ajax({ }); //Your logic 
     } 
     else 
     { 
      event.preventDefault(); 
     } 
});