Adding phone field to contact form

Question

I don´t have almost any knowledge about php. So I am trying to edit a contact form I have in my website by adding a phone field. The problem is, once I do it, it stops working and I don´t receive the messages on my inbox. I am probably doing something wrong but I have no clue what it is.

This is the full code of the contact form:

<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1" />

<?php

    if(isset($_POST['email'])) {

        // EDIT THE 2 LINES BELOW AS REQUIRED
        $email_to = "[email protected]";
        $email_subject = "Contact Form AA";

        function died($error) {
            // your error code can go here
            echo "We are sorry, an error has occurred.";
            echo "The error is the following: <br /><br />";
            echo $error."<br /><br />";
            echo "Please fix the error.<br /><br />";
            die();
        }
        // validation expected data exists
        if(!isset($_POST['first_name']) ||
            !isset($_POST['email']) ||
            !isset($_POST['phone']) ||
            !isset($_POST['comments'])) {
            died('We are sorry, an error has occurred.');       
        }

        $first_name = $_POST['first_name']; // required
        $email_from = $_POST['email']; // required
        $phone = $_POST['phone']; // required
        $comments = $_POST['comments']; // required
        $error_message = "";
        $email_exp = '/^[A-Za-z0-9._%-]+@[A-Za-z0-9.-]+\.[A-Za-z]{2,4}$/';
      if(!preg_match($email_exp,$email_from)) {
        $error_message .= 'The email is not a valid one.<br />';
      }
      if(strlen($first_name) < 2) {
        $error_message .= 'The name is not a valid one.<br />';
      }
      if(strlen($comments) < 2) {
        $error_message .= 'The message is not a valid one.<br />';
      }
      if(strlen($error_message) > 0) {
        died($error_message);
      }

      $email_message = "Contact details:\n\n";
        function clean_string($string) {
          $bad = array("content-type","bcc:","to:","cc:","href");
          return str_replace($bad,"",$string);
        }

        $email_message .= "Name: ".clean_string($first_name)."\n";
        $email_message .= "Email: ".clean_string($email_from)."\n";
        $email_message .= "Phone: ".clean_string($phone)."\n";
        $email_message .= "Menssage: ".clean_string($comments)."\n";

    // create email headers
    $headers = 'From: '.$email_from."\r\n".
    'Reply-To: '.$email_from."\r\n" .
    'X-Mailer: PHP/' . phpversion();
    @mail($email_to, $email_subject, $email_message, $phone, $headers);  
    header("Location: thankyou.html"); 
    ?>

    <?php
    }
    ?>

This are the lines I just added:

!isset($_POST['phone']) ||
$phone = $_POST['phone']; // required
$email_message .= "Phone: ".clean_string($phone)."\n";

And the word $phone, at the end

Can anybody see where the problem is? This is the simple form I am using. Like before, all I have added is the phone part.

<form name="contactform" method="post" action="send_form_email.php">
    <div class="controls">
        <input type="text" name="first_name" placeholder="Name" id="name" required data-validation-required-message="Please enter your name" />
    </div>
    <div class="controls">
        <input type="email" placeholder="Email" name="email" id="email" required data-validation-required-message="Please enter your email address" />
    </div>
    <div class="controls">
        <input type="tel" placeholder="Phone" name="phone" id="phone" required data-validation-required-message="Please enter your phone number" />
    </div>
    <div class="controls">
        <textarea name="comments" rows="5" cols="100" placeholder="Message" id="message" required data-validation-required-message="Please enter your message" maxlength="999" style="resize:none"></textarea>
    </div>
    <button type="submit" class="btn-primary submit">SEND!<i class="fa fa-paper-plane sub"></i></button>

</form>

Thanks for the help!

Answer 1

Like Bilal said

 <input type="phone" placeholder="Phone" name="phone" id="phone" required data-validation-required-message="Please enter your phone number" />
            </div>

is not correct, however you'll want to use type tel

 <input type="tel" placeholder="Phone" name="phone" id="phone" required data-validation-required-message="Please enter your phone number" />
            </div>

EDIT:

your mail syntax is also wrong

remove the $phone from the mail function, since that's just wrong syntax + you already put $phone in the message

so your syntax should look like this:

mail($email_to, $email_subject, $email_message, $headers);