[英]How to get success message after submit on same page - not in new page
我的提交成功消息显示在新页面中。
如何将其显示在与“提交”按钮相同的页面中?
contact.php
<?php
// configure
$from = 'email';
$sendTo = 'email';
$subject = 'new message';
$fields = array('uname' => 'Jmeno', 'surname' => 'Spolecnost', 'phone' => 'Telefon', 'uemail' => 'Email', 'message' => 'Obsah zpravy'); // array variable name => Text to appear in email
$okMessage = 'success';
$errorMessage = 'error';
// let's do the sending
try
{
$emailText = "Mate novou zpravu z web formulare: example.cz\n=============================\n";
foreach ($_POST as $key => $value) {
if (isset($fields[$key])) {
$emailText .= "$fields[$key]: $value\n";
}
}
mail($sendTo, $subject, $emailText, "From: " . $from);
$responseArray = array('type' => 'success', 'message' => $okMessage);
}
catch (\Exception $e)
{
$responseArray = array('type' => 'danger', 'message' => $errorMessage);
}
if (!empty($_SERVER['HTTP_X_REQUESTED_WITH']) && strtolower($_SERVER['HTTP_X_REQUESTED_WITH']) == 'xmlhttprequest') {
$encoded = json_encode($responseArray);
header('location: contact.php?success=1');
echo $encoded;
}
else {
echo $responseArray['message'];
}
?>
JS提交按钮:
$(".open4").click(function() {
$('#basicform').validator();
$('#basicform').on('submit', function (e) {
if (!e.isDefaultPrevented()) {
var url = "contact.php";
$.ajax({
type: "POST",
url: url,
data: $(this).serialize(),
success: function (data)
{
var messageAlert = 'alert-' + data.type;
var messageText = data.message;
var alertBox = '<div class="alert ' + messageAlert + ' alert-dismissable"><button type="button" class="close" data-dismiss="alert" aria-hidden="true">×</button>' + messageText + '</div>';
if (messageAlert && messageText) {
$('#basicform').find('.messages').html(alertBox);
$('#basicform')[0].reset();
}
}
});
return false;
}
})
有2个地方可能会出现问题:
1.PHP代码将您重定向到新页面(好吧,页面是相同的,但是将使用?success=1
参数重新加载):
header('location: contact.php?success=1');
如果您不希望重新加载页面,请尝试以下操作:
if (!empty($_SERVER['HTTP_X_REQUESTED_WITH']) && strtolower($_SERVER['HTTP_X_REQUESTED_WITH']) == 'xmlhttprequest') {
echo json_encode($responseArray);
} else {
echo $responseArray['message'];
}
2.HTML表单提交事件会将您重定向到新页面。 您可以尝试禁用表单的默认行为以submit
事件:
$(".open4").click(function() {
$('#basicform').validator();
$('#basicform').on('submit', function (e) {
//prevent Default functionality
e.preventDefault();
var url = "contact.php";
$.ajax({
type: "POST",
url: url,
data: $(this).serialize(),
success: function (data)
{
var messageAlert = 'alert-' + data.type;
var messageText = data.message;
var alertBox = '<div class="alert ' + messageAlert + ' alert-dismissable"><button type="button" class="close" data-dismiss="alert" aria-hidden="true">×</button>' + messageText + '</div>';
if (messageAlert && messageText) {
$('#basicform').find('.messages').html(alertBox);
$('#basicform')[0].reset();
}
}
});
return false;
});
});
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.