<?php
$sendTo = "example@example.nl"; //Receiver mail
$name = ""; //Sender's Name
$email = ""; //Sender's email address
$phone = ""; //Sender's mobile number
$subject = ""; //Subject of form
$message = ""; //Message of form
$nameErr = "";
$emailErr = "";
$subjectErr = "";
$messageErr = "";
$succesMessage = "";
//On submitting form, below function will execute
if (isset($_POST['submit'])) {
//Check if name is not empty
if (empty($_POST['name'])) {
$nameErr = "Name is required.";
} else {
$name = test_input($_POST['name']);
//Check if name only contains letters and whitespace
if (!preg_match("/^[a-zA-Z ]*$/",$name)) {
$nameErr = "Only letters and whitespace allowed.";
}
}
//Check if email is not empty
if (empty($_POST['email'])) {
$emailErr = "Email is required.";
} else {
$email = test_input($_POST['email']);
//Check if email format is correct
if (!filter_var($email, FILTER_VALIDATE_EMAIL)) {
$emailErr = "Invalid email format.";
}
}
//Phone
if (empty($_POST['phone'])) {
$phone = "Phonenumber not submitted.";
} else {
$phone = test_input($_POST['phone']);
}
//Subject
if (empty($_POST['subject'])) {
$subjectErr = "Subject is required.";
} else {
$subject = test_input($_POST['subject']);
}
//Message
if (empty($_POST['message'])) {
$messageErr = "Message is required.";
} else {
$message = test_input($_POST['message']);
}
if( !($name=='') && !($email=='') && !($subject=='') &&!($message=='') ) {
$emailSubject = "New form submission";
$header= "You have received a new e-mail from " .$name;
$txt = $subject. "\n\n" .$message. "\n\n" . "Contact Details" ."\n". "Name: " .$name. "\n" . "Email: " .$email. "\n" . "Phone: " . $phone;
/* Send the message using mail() function */
if(mail($sendTo, $emailSubject, $txt, $header)) {
$successMessage = "Message sent successfully. I will contact you shortly.";
} else {
$emailErr = "Invalid Email";
}
}
}
function test_input($data) {
$data = trim($data);
$data = stripslashes($data);
$data = htmlspecialchars($data);
return $data;
}
?>
所以我的代码站在所有html之上,代码运行正常!但我不希望页面重新加载并从页面顶部开始。我希望它留在页面的底部,因为这是联系表单所在的位置。我该如何解决这个问题?
我已经阅读了一些修复此问题的JavaScript问题,但我不清楚自己更改自己的代码。
这里的HTML:
<div class="form-container">
<form class="ccform" id="ccform" action="<?php echo htmlspecialchars($_SERVER['PHP_SELF']); ?>" method="post">
<span class="error"><?php echo $nameErr;?></span>
<div class="ccfield">
<span class="ccform-icon"><i class="fa fa-user"></i></span>
<input type="text" class="ccform-field" placeholder="*Full Name" name="name">
</div>
<span class="error"><?php echo $emailErr;?></span>
<div class="ccfield">
<span class="ccform-icon"><i class="fa fa-envelope"></i></span>
<input type="email" class="ccform-field" placeholder="*Email" name="email">
</div>
<div class="ccfield">
<span class="ccform-icon"><i class="fa fa-mobile-phone"></i></span>
<input type="text" class="ccform-field" placeholder="Phonenumber" name="phone">
</div>
<span class="error"><?php echo $subjectErr;?></span>
<div class="ccfield">
<span class="ccform-icon"><i class="fa fa-info"></i></span>
<input type="text" class="ccform-field" placeholder="*Subject" name="subject">
</div>
<span class="error"><?php echo $messageErr;?></span>
<div class="ccfield msgfield">
<span class="ccform-icon"><i class="fa fa-comment"></i></span>
<textarea class="ccform-field" name="message" rows="8" placeholder="*Message"></textarea>
</div>
<div class="ccfield btnfield">
<input class="ccbtn" id="ccbtn" type="submit" value="Submit" name="submit">
</div>
</form>
<span class="error"><?php echo $succesMessage;?></span>
</div>
答案 0 :(得分:2)
我认为您想要的是使用Ajax提交表单。 这是您的原始代码:
<?php
// .....
//On submitting form, below function will execute
if (isset($_POST['submit'])) {
// .....
// After processing your form data, you have to output your result here. For example:
echo $message;
// then exit php script, so that it will not generate HTML below
exit;
}
?>
您的HTML应该有一个如下所示的表单:
<form id="myForm" method="post" action="contact.php">
// ......
<button id="btSubmit" name="submit">Submit</button>
</form>
要不刷新页面,必须使用Ajax,这里我使用jQuery:
<script>
$(function() {
$('#btSubmit').click(function() {
var method = $('#myForm').attr('method');
var action = $('#myForm').attr('action');
$.ajax({
url: action,
method: method,
data: $('#myForm').serialize();
success: function(data) {
// your response data
}
});
});
});
</script>