AJAX和PHP联系表单和电子邮件

时间:2017-01-05 21:42:23

标签: javascript php jquery ajax html5

我一直在使用XAMPP在本地主机上获取此代码的实时视图。但是,几乎不可能看到PHP脚本是否正常工作。它不会发送电子邮件,因此绝对不能在这方面工作。我添加了服务器端验证,但没有显示错误消息。为什么AJAX请求不起作用?

$("#contactForm").validator().on("submit", function (event) {
  if (event.isDefaultPrevented()) {
  //handle the invalid form
    formError();
	submitMSG(false, "Did you fill in the form properly?");
  } else {
  //everything looks good!
	event.preventDefault();
	submitForm();
  }
});

function submitForm() {
  //Initiate Variables with form content
  var name = $("#name").val();
  var email = $("#email").val();
  var message = $("#message").val();

  $.ajax({
    type: "POST",
    url: "php/process.php",
	data: "name=" + name + "&email=" + email + "&message=" + message,
	sucess: function(text) {
	if (text == "sucess") {
		formSuccess();
	} else {
		formError();
		submitMSG(false,text);
	}
}
});
}

function formSuccess() {
  $( "#contactForm")[0].reset();
  submitMSG(true, "Message Submitted!");
}

function formError() {
  $("#contactForm").removeClass().addClass('shake animated').one('webkitAnimationEnd mozAnimationEnd MSAnimationEnd oanimationend animationend', function() {
    $(this).removeClass();
});
}

function submitMSG(valid, msg) {
    var msgClasses;
  if (valid) {
    msgClasses = "h3 text-center tada animated text-success";
  } else {
    msgClasses = "h3 text-center text-danger";
  }
  $("#msgSubmit").removeClass().addClass(msgClasses).text(msg);
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="http://cdn.jsdelivr.net/jquery.validation/1.15.1/jquery.validate.min.js"></script>
<div class="col-md-6 textile">
  <h3 class="form-font text-center">Send me a message</h3>
  <form role="form" id="contactForm">
    <div class="row">
       <div class="form-group form-font col-sm-6">
        	<label for="name" class="h4">Name</label>
        	<input type="text" class="form-control" id="name" placeholder="Enter name" required>
        	<div class="help-block with-errors"></div>
        </div>
        <div class="form-group form-font col-sm-6">
        	<label for="email" class="h4">Email</label>
        	<input type="email" class="form-control" id="email" placeholder="Enter email" required>
        	<div class="help-block with-errors"></div>
        </div>
     </div>
     <div class="form-group form-font">
        <label for="message" class="h4">Message</label>
        	<textarea id="message" class="form-control" rows="5" placeholder="Enter your message" required></textarea>
        	<div class="help-block with-errors"></div>
     </div>
     <button type="submit" id="form-submit" class="btn btn-success btn-lg pull-right">Submit</button>
  <div id="msgSubmit" class="h3 text-center hidden"></div>
  </form>
</div>

<?php
$errorMSG = "";
//Name
if (empty($_POST["name"])) {
    $errorMSG = "Name is required ";
} else {
    $name = $_POST["name"];
}
//Email
if (empty($_POST["email"])) {
    $errorMSG = "Email is required ";
} else {
    $name = $_POST["email"];
}
//Message
if (empty($_POST["message"])) {
    $errorMSG = "Message is required ";
} else {
    $name = $_POST["message"];
}
$EmailTo = "thegmailaddress@gmail.com"
$Subject = "New Message Received";
//prepare email body text
$Body .= "";
$Body .= "Name: ";
$Body .= $name;
$Body .= "\n";
$Body .= "Email: ";
$Body .= $email;
$Body .= "\n";
$Body .= "Message: ";
$Body .= $message;
$Body .= "\n";
//send email
$success = mail($EmailTo, $Subject, $Body, "From:".$email);
//redirect to success page
if ($success && $errorMSG == "") {
    echo "success";
} else {
    if ($errorMSG == "") {
        echo "Something went wrong";
    } else {
        echo $errorMSG;
    }
}
?>

2 个答案:

答案 0 :(得分:0)

此问题是因为您的成功回调拼写错误。你有:

sucess: function(text) {

它应该是:

success: function(text) {

答案 1 :(得分:0)

除了Jeremy Harris所说的,你的PHP代码中也缺少一个分号:

plt.show()