如何使用jquery ajax进行通知

Question

我想询问我创建的公司配置文件应用程序的通知部分使用PHP、AJAX并包含PHP发送邮件的功能。不知怎么的，它不起作用，我不知道出了什么问题。这是我的代码：

<div class="full black">
<div class="large-12 columns">
<h2 class="white">We are ready.</h2>
<div class='form'>
<form id='contact_form'action="send.php" method='POST'>
<div class="large-4 columns">
<input class='required' name='name' placeholder='NAME' type='text'>
</div>
<div class="large-4 columns">
<input class='required email' name='email' placeholder='EMAIL' type='text'>
</div>
<div class="large-4 columns">
<input class='required' name='subject' placeholder='SUBJECT' type='text'>
</div>
<div class="large-12 columns">
<textarea class='required' name='message' placeholder='MESSAGE'></textarea>
<input id="submit" class='button white boxed contact-button' type='submit' value="Send it">
<p id='thanks' class='hide'>
Thanks for contacting us, we'll be in touch soon!
</p>
</div>
</form>
</div>
</div>
</div>
</div>
</div>
<nav>
<a href="#" id='back' class="hide">
<i class="fa fa-close"></i>
</a>
</nav>
if($('form#contact_form').length > 0) {
$('form#contact_form').validate({
messages: { },
submitHandler: function(form) {
$.ajax({
type: 'POST',
url: 'send.php',
data: $(form).serialize(),
success: function(data) {
if(data.match(/success/)) {
$(form).trigger('reset');
$('#thanks').removeClass('hide').fadeOut(5000);
}
}
});
return false;
}
});
}

这是我的发送邮件代码(我使用的是php原生代码(：

$send_to = "[e-mail]";
$send_subject = "Ajax form ";

/*Be careful when editing below this line */

$email = '[e-mail]';
$f_name = cleanupentries($_POST["name"]);
$f_email = cleanupentries($_POST["email"]);
$f_message = cleanupentries($_POST["message"]);
$from_ip = $_SERVER['REMOTE_ADDR'];
$from_browser = $_SERVER['HTTP_USER_AGENT'];
function cleanupentries($entry) {
$entry = trim($entry);
$entry = stripslashes($entry);
$entry = htmlspecialchars($entry);
return $entry;
}
$message = "This email was submitted on " . date('m-d-Y') . 
"nnName: " . $f_name . 
"nnE-Mail: " . $f_email . 
"nnMessage: n" . $f_message . 
"nnnTechnical Details:n" . $from_ip . "n" . $from_browser;
$send_subject .= " - {$f_name}";
$headers = "From: " . $email . "rn" .
"Reply-To: " . $f_email . "rn" .
"X-Mailer: PHP/" . phpversion();

if (!$f_email) {
echo "no email";
exit;
}else if (!$f_name){
echo "no name";
exit;
}else{
if (filter_var($f_email, FILTER_VALIDATE_EMAIL)) {
$mail = mail($send_to, $send_subject, $message, $headers);
if($mail = true){
json_encode(['ressponses' => 'success']);
}else{
return false;
exit;
}
}
}

我真的很困惑。如何用我的代码成功做出响应。有人能帮我吗？

Answer 1

我已经做了一些更改并进行了测试。它工作得很好，试试这个，

<div class="full black">
<div class="large-12 columns">
<h2 class="white">We are ready.</h2>
<div class='form'>
<form id='contact_form' action="send.php" method='POST'>
<div class="large-4 columns">
<input class='required' name='name' id='name' placeholder='NAME' type='text'>
</div>
<div class="large-4 columns">
<input class='required email' name='email'  id='email' placeholder='EMAIL' type='text'>
</div>
<div class="large-4 columns">
<input class='required' name='subject' id='subject' placeholder='SUBJECT' type='text'>
</div>
<div class="large-12 columns">
<textarea class='required' name='message' id ='message' placeholder='MESSAGE'></textarea>
<input id="submit" class='button white boxed contact-button' type='submit' value="Send it">
<p id='thanks' class='hide'>
Thanks for contacting us, we'll be in touch soon!
</p>
</div>
</form>
</div>
</div>
</div>
</div>
</div>
<nav>
<a href="#" id='back' class="hide">
<i class="fa fa-close"></i>
</a>
</nav>

在您的javaScript中，

<script type="text/javascript">
$("#contact_form").unbind('submit').bind('submit', function() {
$(".text-danger").remove();
// remove the form error
$('.form-group').removeClass('has-error').removeClass('has-success');
var name = $("#name").val();
var email = $("#email").val();
if (name === "") {
$("#name").after('<p class="text-danger">Name field is required</p>');
//  $('#name').closest('.form-group').addClass('has-error');
} else {
// remov error text field
$("#name").find('.text-danger').remove();
//  $("#name").closest('.form-group').addClass('has-success');
}
if (email === "") {
$("#name").after('<p class="text-danger">email field is required</p>');
//  $('#name').closest('.form-group').addClass('has-error');
} else {
$("#name").find('.text-danger').remove();
//  $("#name").closest('.form-group').addClass('has-success');
}
//same as subject and message 
if (name && email) {
var form = $(this);

$.ajax({
url: form.attr('action'),
type: form.attr('method'),
data: form.serialize(),
dataType: 'json',
success: function(response) {

if (response.success == true) {
console.log(response.messages);
// reset the form text
$("#contact_form")[0].reset();
$('#thanks').removeClass('hide').fadeOut(5000);
} // if
} // /success
}); // /ajax
} // if
return false;
}); // /submit form function
</script>

你的send.php文件应该是这样的，

<?php
$valid['success'] = array('success' => false, 'messages' => array());
$send_to = "[e-mail]";
$send_subject = "Ajax form ";
/*Be careful when editing below this line */
$email = '[e-mail]';
$f_name = cleanupentries($_POST["name"]);
$f_email = cleanupentries($_POST["email"]);
$f_message = cleanupentries($_POST["message"]);
$from_ip = $_SERVER['REMOTE_ADDR'];
$from_browser = $_SERVER['HTTP_USER_AGENT'];
function cleanupentries($entry)
{
$entry = trim($entry);
$entry = stripslashes($entry);
$entry = htmlspecialchars($entry);
return $entry;
}
$message = "This email was submitted on " . date('m-d-Y') .
"nnName: " . $f_name .
"nnE-Mail: " . $f_email .
"nnMessage: n" . $f_message .
"nnnTechnical Details:n" . $from_ip . "n" . $from_browser;
$send_subject .= " - {$f_name}";
$headers = "From: " . $email . "rn" .
"Reply-To: " . $f_email . "rn" .
"X-Mailer: PHP/" . phpversion();
if (!$f_email) {
$valid['success'] = false;
$valid['messages'] = "No email";
//  exit;
} elseif (!$f_name) {
$valid['success'] = false;
$valid['messages'] = "No name";
//  exit;
} else {
if (filter_var($f_email, FILTER_VALIDATE_EMAIL)) {
$mail = mail($send_to, $send_subject, $message, $headers);
if ($mail = true) {
$valid['success'] = true;
$valid['messages'] = "Successfully sent";
//json_encode(['ressponses' => 'success']);
} else {
$valid['success'] = false;
$valid['messages'] = "Send fail";
}
}
}
echo json_encode($valid);

我想这会有帮助。