Configuration issue with PHP contact form

Question

I have seen that there are many similar to mine questions here on StackOverflow, but I think I was not able to find the correct solution to my question yet.

The problem what I am having is connected with receiving emails functionality - basically a contact us section of the website, where user can fill in html based form and press send message and this message will be delivered to my email.

I do my development using XAMPP and running the Apache server and Mercury on localhost. Even though validation shows success - emails do not get through.

1. I have tried to add method="post" to HTML section, but found out that type: "POST" is already included.
2. Double checked what port Mercury uses and compared it with the one mentioned in php.ini both are set to 25.
3. I have also tried to deploy to Bitbucket pages and Azure to move from localhost to live hosting.

I have carefully read through this very detailed post. The idea to upload the website to live hosting came from this post.

<?php
$name = trim($_POST['name']);
$email = trim($_POST['email']);
$message = trim($_POST['message']);


if( isset($name) && isset($email) ) {

    // Avoid Email Injection and Mail Form Script Hijacking
    $pattern = "/(content-type|bcc:|cc:|to:)/i";
    if( preg_match($pattern, $name) || preg_match($pattern, $email) || preg_match($pattern, $message) ) {
        exit;
    }

    $to = "[email protected]";
    $sub = "$name from Cv";
    // HTML Elements for Email Body
    $body = <<<EOD
    <strong>Name:</strong> $name <br>
    <strong>Email:</strong> <a href="mailto:$email?subject=feedback" "email me">$email</a> <br> <br>
    <strong>Message:</strong> $message <br>
EOD;

    $headers = "From: $name <$email>\r\n";
    $headers .= 'MIME-Version: 1.0' . "\r\n";
    $headers .= 'Content-type: text/html; charset=iso-8859-1' . "\r\n";

    mail($to, $sub, $body, $headers);
}

?>

$("#contact-form-1").submit(function(e) {
  e.preventDefault();
  var success = $(this).find('.email-success'),
      failed = $(this).find('.email-failed'),
      loader = $(this).find('.email-loading'),
      postUrl = $(this).attr('action');

  success.fadeOut(100); failed.fadeOut(100); loader.fadeOut(100);

  var data = {
    name: $(this).find('.contact-name').val(),
    email: $(this).find('.contact-email').val(),
    message: $(this).find('.contact-message').val()
  };

  if ( isValidEmail(data['email']) && (data['message'].length > 1) && (data['name'].length > 1) ) {
    $.ajax({
      type: "POST",
      url: postUrl,
      data: data,
      beforeSend: function() {
        loader.fadeIn(500);
      },
      success: function(data) {
        loader.fadeOut(500);
        failed.fadeOut(500);
        success.delay(500).fadeIn(500);
      },
      error: function(xhr) { // if error occured
        loader.fadeOut(500);
        success.fadeOut(500);
        failed.delay(500).fadeIn(500);
      },
      complete: function() {
        loader.fadeOut(500);
      }
    });
  } else {
    loader.fadeOut(500);
    failed.delay(500).fadeIn(500);
    success.fadeOut(500);
  }

  return false;
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<form id="contact-form-1" action="sendmail.php" method="POST">
  
  <input class="contact-name form-control" type="text" name="name" placeholder="FULL NAME">
  <input class="contact-email form-control" type="text" name="email" placeholder="EMAIL">
  <textarea class="contact-message form-control" name="message" placeholder="MESSAGE" rows="5"></textarea>
  <button class="btn">SEND MESSAGE</button>

</form>

NOTE: I did not write this code by myself as it was provided by the template creator. I have contacted the template creator and faced an absolutely terrible support. This is the main reason of my post here.

Physician

Well, you aren't checking whether the email was sent successfully or not, – Meurer

@Meurer I've added validation. Please check out the updated post. – Physician

Do you have any error message ? – Adjudge

@Adjudge no error messages. I get this XHR finished loading: POST jquery-1.11.3.js:9664 as an approval that my email was sent "successfully" but nothing was not sent at all. – Physician

Have you installed a mail server in your XAMPP ? By default php uses localhost as smtp server. – Adjudge

@Adjudge I have not installed the separate mail server for XAMPP, but I believe that Mercury, should be able to cover that functionality. Btw, I have also mentioned in my question that I have moved the website to Bitbucket pages and still nothing works. – Physician

Answer 1

While looking doing more research and asking around I found this extremely useful answer what finally got my local XAMPP configuration fixed. So there was nothing wrong with code itself but my configuration was the issue.

IMPORTANT: try to follow the steps as close as possible, simple ; missing can do the big difference in the final result. So double check every step if something seems to be broken.

Also found one other very insightful and interesting to read post.

Physician