以下代码不起作用,任何想法为什么?我们正在使用Mandrill创建一个使用PHP的后端。我们这样做是因为检查元素的访问者看不到我们的API。非常感谢!
HTML:
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.0/jquery.min.js"> </script>
<script src="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"> </script>
<script src='http://qtip2.com/static/javascripts/libs/jquery.fullcalendar.min.js'></script>
<script src='http://qtip2.com/static/javascripts/libs/jquery.fullcalendar.min.js'></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.0/jquery.min.js"></script>
</head>
<body>
<form id="contactForm" class="form-horizontal">
<div class="form-group">
<label class="col-xs-3 control-label">Full name</label>
<div class="col-xs-4">
<input type="text" class="form-control" name="firstName" placeholder="First name" />
</div>
<div class="col-xs-4">
<input type="text" class="form-control" name="lastName" placeholder="Last name" />
</div>
</div>
<div class="form-group">
<label class="col-xs-3 control-label">Phone number</label>
<div class="col-xs-5">
<input type="text" class="form-control" name="phoneNumber" />
</div>
</div>
<div class="form-group">
<label class="col-xs-3 control-label">Email address</label>
<div class="col-xs-5">
<input type="text" class="form-control" name="email" />
</div>
</div>
<div class="form-group">
<label class="col-xs-3 control-label">Message</label>
<div class="col-xs-9">
<textarea class="form-control" name="message" rows="7"></textarea>
</div>
</div>
<div class="form-group">
<label class="col-xs-3 control-label" id="captchaOperation"></label>
<div class="col-xs-3">
<input type="text" class="form-control" name="captcha" />
</div>
</div>
<div class="form-group">
<div class="col-xs-9 col-xs-offset-3">
<button type="submit" class="btn btn-primary">Submit</button>
</div>
</div>
<script>
$('#contactForm')
.formValidation({
})
.on('success.form.fv', function(e) {
// Prevent default form submission
e.preventDefault();
var $form = $(e.target);
// Send all form data to back-end
$.ajax({
url: '/path/to/your/send-mail.php',
type: 'POST',
data: $form.serialize(),
dataType: 'json',
success: function(response) {
// Clear the form
$form.formValidation('resetForm', true);
// Regenerate the captcha
generateCaptcha();
// Show the message
response.result === 'error'
? $('#alertContainer')
.removeClass('alert-success')
.addClass('alert-warning')
.html('Sorry, cannot send the message')
.show()
: $('#alertContainer')
.removeClass('alert-warning')
.addClass('alert-success')
.html('Your message has been successfully sent')
.show();
}
});
});
PHP(文件路径只是/send-mail.php)
<?php
// send-mail.php
// Download Mandrill PHP library from
// https://bitbucket.org/mailchimp/mandrill-api-php/get/master.zip
require_once '/path/to/Mandrill.php';
try {
// See https://mandrillapp.com/api/docs/index.php.html
$mandrill = new Mandrill('API KEY');
// Build the message body
$body = array(
'<strong>Name:</strong> ' + $_POST['firstName'] + ' ' + $_POST['lastName'],
'<strong>Phone number:</strong> ' + isset($_POST['phoneNumber']) ? $_POST['phoneNumber'] : 'n/a',
'<strong>Message:</strong> ',
$_POST['message'],
);
$body = implode('<br/>', $body);
$message = array(
'html' => $body,
'subject' => 'Contact form',
'from_email' => $_POST['email'],
'from_name' => $_POST['firstName'] + ' ' + $_POST['lastName'],
'to' => array(
array(
'email' => 'myemail@email.com',
'name' => 'Me',
'type' => 'to'
)
),
'headers' => array(
'Reply-To' => 'message.reply@example.com'
),
);
$async = false;
$result = $mandrill->messages->send($message, $async);
echo json_encode(array(
'result' => 'ok',
));
} catch(Mandrill_Error $e) {
echo json_encode(array(
'result' => 'error',
));
}