I’m working on a contact form.
It’s working fine. User fills up contact form, processed by PHP, if successful, the user will be redirected to a thank you page then will redirect back to the main webpage after 3 or so seconds.
I want the form to “not” redirect to a different page after form submission, but instead just display a text below the form saying for example “Form sent successfully!” and the textboxes shall be cleared.
And if it’s possible to not include any PHP code in the main webpage as I want it to remain a .html file.
I’m a beginner in PHP, so coding on my own is not possible for now but I know a few terms and can follow basic codes (I think).
Here are the codes.
index.html
<!DOCTYPE html>
<html>
<head>
</head>
<body>
<!-- CONTACT FORM : BEGIN -->
<div>
<form method="post" name="myemailform" action="form-to-email.php">
<div>
<input type="text" placeholder="Your Name" name="name" id="name" required>
</div>
<div>
<input type="email" placeholder="Your Email" name="email" id="email" required>
</div>
<div>
<input type="text" placeholder="Your Phone" name="phone" id="phone">
</div>
<div>
<textarea id="msg" placeholder="Describe your mining need" name="message" id="needs" required></textarea>
</div>
<div>
<input class="form-submit-button-text" type="submit" name='submit' value="SUBMIT" style="width: 200px;">
</div>
</form>
</div>
<!-- CONTACT FORM : END -->
</body>
</html>
thank-you-page.html
<!DOCTYPE html>
<html>
<head>
<title>Thank you!</title>
<link rel="stylesheet" type="text/css" href="style.css">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="generator" content="TSW WebCoder">
</head>
<body>
<div class="part-five part-four" id="Get-Started" style="display: flex; align-items: center; justify-content: center; background-size: auto !important;">
<p>Thank you for reaching out to us. We will get back to you shortly. Please click <a href="index.html" style="text-decoration: none; color #0986d9 !important;;">here </a> if you are not redirected within a few seconds.</p>
</div>
<script src="http://code.jquery.com/jquery-3.3.1.js"></script>
<script>
setTimeout(function () {
window.location.replace("index.html"); //will redirect to main page (index.html)
}, 3000); //will call the function after 3 secs.
</script>
</body>
</html>
form-to-email.php
<?php
if(!isset($_POST['submit'])) {
//This page should not be accessed directly. Need to submit the form.
echo "error; you need to submit the form!";
}
$name = $_POST['name'];
$visitor_email = $_POST['email'];
$phone = $_POST['phone'];
$message = $_POST['message'];
//Validate first
if(empty($name)||empty($visitor_email)) {
echo "Name and email are mandatory!";
exit;
}
if(IsInjected($visitor_email)) {
echo "Bad email value!";
exit;
}
$email_from = 'email@example.com';//<== update the email address
$email_subject = "Inquiry";
$email_body = "You have received a new message from the user $name.\n".
"Here is the message:\nName : $name \nE-mail : $visitor_email \nPhone : $phone \nMessage : $message \n".
$to = "email@example.com";//<== update the email address
$headers = "From: $email_from \r\n";
$headers .= "Reply-To: $visitor_email \r\n";
//Send the email!
mail($to,$email_subject,$email_body,$headers);
//done. redirect to thank-you page.
header('Location: thank-you.html');
// Function to validate against any email injection attempts
function IsInjected($str) {
$injections = array('(\n+)',
'(\r+)',
'(\t+)',
'(%0A+)',
'(%0D+)',
'(%08+)',
'(%09+)'
);
$inject = join('|', $injections);
$inject = "/$inject/i";
if(preg_match($inject,$str)) {
return true;
}
else {
return false;
}
}
?>
If anyone can give me an idea on how to do what I wanna do, that would be great.
I’ve uploaded these to a web host so I can link you up to it Just let me know and I’ll send it to you via pm. Thank you!
