HTML5, CSS3, PHP contact form not sending info + add required fields

Question

I've added a contact form to my website. The form sends out the email, however i'm not receiving the information. All the fields come out blank. Also, i'd like to make the fields required. Anyone?

Here's the PHP

<?php
$field_name = $_POST['Name...'];
$field_email = $_POST['Email...'];
$field_phone = $_POST['Phone...'];
$field_company = $_POST['Company'];
$field_message = $_POST['Message...'];

$mail_to = 'email@me.com';
$subject = '#Message from Website# '.$field_name;

$body_message .= 'From: '.$field_name."\n";
$body_message .= 'Email: '.$field_email."\n";
$body_message .= 'Phone: '.$field_phone."\n";
$body_message .= 'Company: '.$field_company."\n";
$body_message .= 'Message: '.$field_message."\n";

$headers = 'From: '.$E-Mail."\r\n";
$headers .= 'Reply-To: '.$E-Mail."\r\n";

$mail_status = mail($mail_to, $subject, $body_message, $headers);

if ($mail_status) { ?>
 <script language="javascript" type="text/javascript">
  alert('Thank you for the message. We will contact you shortly.');
  window.location = 'index.html';
 </script>
<?php
}
else { ?>
 <script language="javascript" type="text/javascript">
  alert('Message sending failed. Please, send an email to         
email@me.com');
  window.location = 'index.html';
 </script>
<?php }
?>

Here's the Form

<form action="contact.php" method="post">
    <input type="text" class="text" value="Name..." onfocus="this.value = '';" onblur="if (this.value =='') {this.value = 'Name...';}">
    <input type="text" class="text" value="Email..." onfocus="this.value = '';" onblur="if (this.value == '') {this.value = 'Email...';}">
    <input type="text" class="text" value="Phone..." onfocus="this.value = '';" onblur="if (this.value == '') {this.value = 'Phone...';}">
    <input type="text" class="text" value="Company..." onfocus="this.value = '';" onblur="if (this.value == '') {this.value = 'Company...';}">
    <textarea value="Message..." onfocus="this.value = '';" onblur="if (this.value == '') {this.value = 'Message';}">Message...</textarea>
    <input class="wow shake" data-wow-delay="0.3s" type="submit" value="Send Message" />
</form>

Answer 1

Its blank because your inputs do not have a name attribute. All inputs need the name attribute. Example:

<input type="text" value="" id="first_name" name="first_name" />

Answer 2

There are no name attributes in your HTML. Ensure that there are name attributes so that they are accessible in PHP.

Also, please be careful as to not name the attributes as "Name...", Remove the dots

Answer 3

If your $_POST should return something for your attribution, you need to specify attribute name inside each input field you created with those respective value declared inside $_POST's.

Besides, you will probably face blank pages, which means you have a syntax error.

It was not difficult to find what is wrong.

At the line 4 of your snippet code, I can see there is a letter v among with your declared variable:

<?php
$field_name = $_POST['Name...'];
$field_email = $_POST['Email...'];
v$field_phone = $_POST['Phone...'];
$field_company = $_POST['Company'];
$field_message = $_POST['Message...'];

Remove it and try to refresh the page again.
Also, It is important you to look at php_error_log and see what kind of error your are facing it.

EDIT

If you want to turn required field, HTML5 has a new attribute that you can include on each input tag called required .
Just add at the end of your input tag this attribute like this:

<input type="text" class="text" name="Name" value="Name..." onfocus="this.value = '';" onblur="if (this.value =='') {this.value = 'Name...';}" required>

There are a lot of new attributes for HTML5 you can find in here: http://www.w3schools.com/html/html_form_attributes.asp

Answer 4

You can use an if to check if the values are empty or not, eg:

if(!empty($field_name)) {
   // the field name is not empty and you can send the mail
   $mail_status = mail($mail_to, $subject, $body_message, $headers);
}

Also you have to give your <input /> fields the correct name. You could do this:

<?php $field_name = $_POST['fieldname']; ?>
<input name="fieldname" />

Answer 5

You're making a simple mistake - when an html input element posts to a php form, the index that it fills in the $_POST array is based on the name attribute of the html element, but you are using the value attribute instead.

I would also avoid strange characters like periods in your name attribute.

Try replacing

<input type="text" class="text" value="Name..." onfocus="this.value = '';" onblur="if (this.value == '') {this.value = 'Name...';}">

with

<input type="text" class="text" name="Name" onfocus="this.value = '';" onblur="if (this.value == '') {this.value = 'Name...';}">