Display success message when form is submitted

Hi there,

I am trying to create a simple contact form with RECAPTCHA that then displays an message when the form has been successfully submitted. To do this, I’ve used a bit of jQuery. The form works fine, but I can’t seem to get the success message to display.

Can anyone see what is wrong?

  <script src='https://www.google.com/recaptcha/api.js'></script>
  <form action="<?php echo $_SERVER['PHP_SELF']; ?>" method="post" id="contact" class="contact-form">
    <h1>Contact Us</h1>
    <label>Your Name</label>
    <input type="text" name="name" required autofocus/>
    <label>Email Address</label>
    <input type="email" name="email" required/>
    <label>Message</label>
    <textarea name="message" required></textarea>

    <!-- [PUT THE CAPTCHA WHERE YOU WANT IT] -->
    <div class="g-recaptcha" data-sitekey="mysitekey"></div>
    <input type="submit" value="Submit"/>
	  
<script>
$('.contact-form').submit(function() {
   $('#myResultDiv').text("Form submitted");
   return false;
});
</script>
	  
	  
	  <div id="myResultDiv"></div>
	  
	  
	  
  </form>
<?php
/* [VERIFY CAPTCHA FIRST] */
$secret = 'mysecretkey'; // CHANGE THIS TO YOUR OWN!
$url = "https://www.google.com/recaptcha/api/siteverify?secret=$secret&response=".$_POST['g-recaptcha-response'];
$verify = json_decode(file_get_contents($url));

/* [PROCESS YOUR FORM] */
if ($verify->success) {
  $to = "me@me.com"; 
  $subject = "Contact Form";
  $message = "Name - " . $_POST['name'] . "r\n";
  $message .= "Email - " . $_POST['email'] . "r\n";
  $message .= "Message - " . $_POST['message'] . "r\n";
  if (@mail($to, $subject, $message)) {
    // Send mail OK
    // @TODO - Show a nice thank you page or something
  } else {
    // Send mail error
    // @TODO - Ask user to retry or give alternative
  }
} else {
  // Invalid captcha
  // @TODO - Show error message, ask user to retry
}
?>

Thank you

1 Like

$_SERVER[‘PHP_SELF’] is vulnerable to an XSS attack. Get rid of it. Actually, just delete the entire action string. Delete this part:

action="<?php echo $_SERVER['PHP_SELF']; ?>"

There is no need to use Javascript. Just check the REQUEST METHOD for a POST request and process the form.

The Php should be at the top of the page and HTML at the bottom.

Thanks for the reply.

I removed the action and added this:

<?php if (count($_POST)>0) echo "Form Submitted!"; ?>

There is no need to do the count. If you check the SERVER REQUEST method like I said, then you already know their was a POST request. That if count is is just not needed at all.

I see. I am very new to PHP, so I don’t know how to do that :confused:

if($_SERVER['REQUEST_METHOD'] == 'POST'){
    // Parse form data here
}
2 Likes

Hi,
You can achieve it by following ways:

1- Using query parameters in the url e.g( https://xyz.com/user.php?status=1);

<?php 
				$errors = array (
					"1" => "An  E-mail has been sent to your provided email Successfully!",
					"2" => "This E-mail doesn't exist. <br> Please Signup to login an Account."
				);
				$error_id = isset($_GET['request_status']) ? $_GET['request_status'] : 0;
				// echo $error_id;
				?>
				<!-- Reset password  validation msg -->
				<?php if (
$error_id !== 0 ): ?>
					<div class="alert alert-success" >
						<strong> <?php echo $errors[$error_id]; ?></strong> 
					</div>

				<?php endif ?>
  1. By saving it in the sessions and unset the session afterwards

If you are using a framework like laravel or CI then they have their own function like “flashdata” to show the messages