Форма, не отправляющая при попытке использования jQuery's submitHandler

Я конвертирую форму контакта в AJAX, чтобы я мог выполнять функцию успеха. В настоящий момент код останавливается в секции submitHandler, говоря, что он не определен. Как мой submitHandler не определен?

submitHandler(function(form) {

Правильно ли я делаю это? Я хочу использовать мой текущий php, потому что я построил его для проверки подлинности на основе проверки jQuery.

Кто-нибудь видит, что не так с submitHandler, и все, что может помешать этому отправлять?

HTML

 <div class="contact-container"> <form id="contactform" method="post" action="" novalidate> <?php if($sent === true) { echo "<h2 class='success'>Thanks, your message has been sent successfully</h2>"; } elseif($hasError === true) { echo '<ul class="errorlist">'; foreach($errorArray as $key => $val) { echo "<li>" . ucfirst($key) . " field error - $val</li>"; } echo '</ul>'; } ?> <div> <input type="text" class="contact_input" name="name" id="name" value="<?php echo (isset($name) ? $name : ""); ?>" placeholder="Name"> </div> <div> <input type="email" class="contact_input" name="email" id="email" value="<?php echo (isset($email) ? $email : ""); ?>" placeholder="Email"> </div> <div> <textarea name="message" class="contact_input" id="message" placeholder="Message"><?php echo (isset($message) ? $message : ""); ?></textarea> </div> <input type="submit" id="submit_contact" class="clear" name="submitform" value="Send"> </form> </div> <div class="contact-email-success"> <div class="contact-email-success-container"> <div id="contact-email-success-title">THANK YOU FOR CONTACTING OUR AGENCY!</div> <div id="contact-email-success-description">Your submission has been received and one of our team members will contact you shortly.</div> </div> </div> 

JQuery

 //Send the project email $(document).ready(function(){ $("#submit_contact").on("click", function (event) { //event.preventDefault(); $("#contactform").validate({ rules: { name: { required: true, minlength: 2 }, email: { required: true, email: true }, message: { required: true, minlength: 5 } }, messages: { name: { required: "Please enter your name", minlength: "Your name seems a bit short, doesn't it?" }, email: { required: "Please enter your email address", email: "Please enter a valid email address" }, message: { required: "Please enter your message", minlength: "Your message seems a bit short. Please enter at least 5 characters" } } }); submitHandler(function(form) { //Variables for the form ids var name = $("#name").val(); var email = $("#email").val(); var message = $("#message").val(); $.ajax({ url: "email-contact.php", type: "POST", data: { "project_name": name, "title_roll": email, "project_email": message }, success: function (data) { //console.log(data); // data object will return the response when status code is 200 if (data == "Error!") { alert("Unable to send email!"); alert(data); } else { $(".contact-container").addClass("removeClass"); $(".contact-email-success").show(); $(".announcement_success").fadeIn(); $(".announcement_success").show(); // $('.announcement_success').html('Email Successfully sent!'); //$('.announcement_success').delay(5000).fadeOut(400); } }, error: function (xhr, textStatus, errorThrown) { alert(textStatus + "|" + errorThrown); //console.log("error"); //otherwise error if status code is other than 200. } }); }); }); }); 

PHP

 $hasError = false; $sent = false; $name = $_POST['name']; $email = $_POST['email']; $message = $_POST['message']; if(isset($_POST['submitform'])) { $name = trim(htmlspecialchars($_POST['name'], ENT_QUOTES)); $email = trim(htmlspecialchars($_POST['email'])); $message = trim(htmlspecialchars($_POST['message'], ENT_QUOTES)); $fieldsArray = array( 'name' => $name, 'email' => $email, 'message' => $message ); $errorArray = array(); foreach($fieldsArray as $key => $val) { switch ($key) { case 'name': case 'message': if(empty($val)) { $hasError = true; $errorArray[$key] = ucfirst($key) . " field was left empty."; } break; case 'email': if(!filter_var($email, FILTER_VALIDATE_EMAIL)) { $hasError = true; $errorArray[$key] = "Invalid Email Address entered"; } else { $email = filter_var($email, FILTER_SANITIZE_EMAIL); } break; } } if($hasError !== true) { $to = "gsdfa"; $subject = "Contact Form Submitted"; $msgcontents = "Name: $name<br>Email: $email<br>Message: $message"; $headers = "MIME-Version: 1.0 \r\n"; $headers .= "Content-type: text/html; charset=iso-8859-1 \r\n"; $headers .= "From: $name <$email> \r\n"; $emailsent = mail($to, $subject, $msgcontents,$headers); if($mailsent) { $sent = true; unset($name); unset($email); unset($message); } } } с $hasError = false; $sent = false; $name = $_POST['name']; $email = $_POST['email']; $message = $_POST['message']; if(isset($_POST['submitform'])) { $name = trim(htmlspecialchars($_POST['name'], ENT_QUOTES)); $email = trim(htmlspecialchars($_POST['email'])); $message = trim(htmlspecialchars($_POST['message'], ENT_QUOTES)); $fieldsArray = array( 'name' => $name, 'email' => $email, 'message' => $message ); $errorArray = array(); foreach($fieldsArray as $key => $val) { switch ($key) { case 'name': case 'message': if(empty($val)) { $hasError = true; $errorArray[$key] = ucfirst($key) . " field was left empty."; } break; case 'email': if(!filter_var($email, FILTER_VALIDATE_EMAIL)) { $hasError = true; $errorArray[$key] = "Invalid Email Address entered"; } else { $email = filter_var($email, FILTER_SANITIZE_EMAIL); } break; } } if($hasError !== true) { $to = "gsdfa"; $subject = "Contact Form Submitted"; $msgcontents = "Name: $name<br>Email: $email<br>Message: $message"; $headers = "MIME-Version: 1.0 \r\n"; $headers .= "Content-type: text/html; charset=iso-8859-1 \r\n"; $headers .= "From: $name <$email> \r\n"; $emailsent = mail($to, $subject, $msgcontents,$headers); if($mailsent) { $sent = true; unset($name); unset($email); unset($message); } } } с $hasError = false; $sent = false; $name = $_POST['name']; $email = $_POST['email']; $message = $_POST['message']; if(isset($_POST['submitform'])) { $name = trim(htmlspecialchars($_POST['name'], ENT_QUOTES)); $email = trim(htmlspecialchars($_POST['email'])); $message = trim(htmlspecialchars($_POST['message'], ENT_QUOTES)); $fieldsArray = array( 'name' => $name, 'email' => $email, 'message' => $message ); $errorArray = array(); foreach($fieldsArray as $key => $val) { switch ($key) { case 'name': case 'message': if(empty($val)) { $hasError = true; $errorArray[$key] = ucfirst($key) . " field was left empty."; } break; case 'email': if(!filter_var($email, FILTER_VALIDATE_EMAIL)) { $hasError = true; $errorArray[$key] = "Invalid Email Address entered"; } else { $email = filter_var($email, FILTER_SANITIZE_EMAIL); } break; } } if($hasError !== true) { $to = "gsdfa"; $subject = "Contact Form Submitted"; $msgcontents = "Name: $name<br>Email: $email<br>Message: $message"; $headers = "MIME-Version: 1.0 \r\n"; $headers .= "Content-type: text/html; charset=iso-8859-1 \r\n"; $headers .= "From: $name <$email> \r\n"; $emailsent = mail($to, $subject, $msgcontents,$headers); if($mailsent) { $sent = true; unset($name); unset($email); unset($message); } } } с $hasError = false; $sent = false; $name = $_POST['name']; $email = $_POST['email']; $message = $_POST['message']; if(isset($_POST['submitform'])) { $name = trim(htmlspecialchars($_POST['name'], ENT_QUOTES)); $email = trim(htmlspecialchars($_POST['email'])); $message = trim(htmlspecialchars($_POST['message'], ENT_QUOTES)); $fieldsArray = array( 'name' => $name, 'email' => $email, 'message' => $message ); $errorArray = array(); foreach($fieldsArray as $key => $val) { switch ($key) { case 'name': case 'message': if(empty($val)) { $hasError = true; $errorArray[$key] = ucfirst($key) . " field was left empty."; } break; case 'email': if(!filter_var($email, FILTER_VALIDATE_EMAIL)) { $hasError = true; $errorArray[$key] = "Invalid Email Address entered"; } else { $email = filter_var($email, FILTER_SANITIZE_EMAIL); } break; } } if($hasError !== true) { $to = "gsdfa"; $subject = "Contact Form Submitted"; $msgcontents = "Name: $name<br>Email: $email<br>Message: $message"; $headers = "MIME-Version: 1.0 \r\n"; $headers .= "Content-type: text/html; charset=iso-8859-1 \r\n"; $headers .= "From: $name <$email> \r\n"; $emailsent = mail($to, $subject, $msgcontents,$headers); if($mailsent) { $sent = true; unset($name); unset($email); unset($message); } } } 

Вам необходимо определить submitHandler внутри функции validate() . Но вы просто пытаетесь выполнить его снаружи. Сделайте это так –

 $("#contactform").validate({ rules: {...}, messages: {...}, submitHandler: function(form) { //Variables for the form ids var name = $("#name").val(); var email = $("#email").val(); var message = $("#message").val(); $.ajax({ url: "email-contact.php", type: "POST", data: { "project_name": name, "title_roll": email, "project_email": message }, success: function (data) { //console.log(data); // data object will return the response when status code is 200 if (data == "Error!") { alert("Unable to send email!"); alert(data); } else { $(".contact-container").addClass("removeClass"); $(".contact-email-success").show(); $(".announcement_success").fadeIn(); $(".announcement_success").show(); // $('.announcement_success').html('Email Successfully sent!'); //$('.announcement_success').delay(5000).fadeOut(400); } }, error: function (xhr, textStatus, errorThrown) { alert(textStatus + "|" + errorThrown); //console.log("error"); //otherwise error if status code is other than 200. } }); } }); 

См. Примеры в документации SubmitHandler .

использовать это:

JQuery:

 $(document).ready(function(){ $("#submit_contact").click(function(){ event.preventDefault(); var name = $("#name").val(); var email = $("#email").val(); var message = $("#message").val(); $.ajax({ url: "email-contact.php", type: "POST", data: { "project_name": name, "title_roll": email, "project_email": message }, success: function (data) { //console.log(data); // data object will return the response when status code is 200 if (data == "Error!") { alert("Unable to send email!"); alert(data); } else { $(".contact-container").addClass("removeClass"); $(".contact-email-success").show(); $(".announcement_success").fadeIn(); $(".announcement_success").show(); // $('.announcement_success').html('Email Successfully sent!'); //$('.announcement_success').delay(5000).fadeOut(400); } }, error: function (xhr, textStatus, errorThrown) { alert(textStatus + "|" + errorThrown); //console.log("error"); //otherwise error if status code is other than 200. } }); }); }); 

И в вашем файле php-файла:

 $name = $_POST['name']; $email = $_POST['email']; $message = $_POST['message']; 

в

 $name = $_POST['project_name']; $email = $_POST['title_roll']; $message = $_POST['project_email']; 

надеяться на его помощь