Why won't my contact us page form not work properly?

Question

The emails being sent from my 'Contact Us' page are only containing the subject "Contact Us page message from " and the first parts of the body messages eg From: IGN: E-mail:

It would seem that the fields just aren't working but I don't know why.

Here is my contact us php code:

$mail_to = 'support@mineyc.com';
$subject = 'Contact Us page message from '.$field_name;

$body_message = 'From: '.$field_name."\n";
$body_message .= 'IGN: '.$field_ign."\n";
$body_message .= 'E-mail: '.$field_email."\n";
$body_message .= 'Message: '.$field_message;

$headers = 'From: '.$field_email."\r\n";
$headers .= 'Reply-To: '.$field_email."\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 = '/contactus.html';
    </script>
<?php
}
else { ?>
    <script language="javascript" type="text/javascript">
        alert('Message failed. Please, send an email to support@mineyc.com');
        window.location = '/contactus.html';
    </script>
<?php
}
?>

Here is the HTML code:

    <!-- Main Content -->
    <div class="container">
      <div class="well">
        <div class="row">
          <div class="col-lg-6">
            <div class="well">
              <form class="form-horizontal" action="/php/contact.php" method="post">
                <fieldset>
                  <legend>Contact Us</legend>
                  <div class="form-group">
                    <label for="inputName" class="col-lg-2 control-label">Name</label>
                    <div class="col-lg-10">
                      <input type="text" class="form-control" id="inputName" placeholder="Name">
                    </div>
                  </div>
                  <div class="form-group">
                    <label for="inputIGN" class="col-lg-2 control-label">IGN</label>
                    <div class="col-lg-10">
                      <input type="text" class="form-control" id="inputIGN" placeholder="In-game Name">
                    </div>
                  </div>
                  <div class="form-group">
                    <label for="inputEmail" class="col-lg-2 control-label">Email</label>
                    <div class="col-lg-10">
                      <input type="text" class="form-control" id="inputEmail" placeholder="Email">
                    </div>
                  </div>
                  <div class="form-group">
                        <label for="textArea" class="col-lg-2 control-label">Message</label>
                    <div class="col-lg-10">
                          <textarea class="form-control" rows="3" id="textArea"></textarea>
                      <span class="help-block">Please enter a real email address so that we can reply to your message.</span>
                    </div>
                  </div>
                  <div class="form-group">
                    <div class="col-lg-10 col-lg-offset-2">
                      <button type="submit" class="btn btn-primary">Submit</button> 
                    </div>
                  </div>
                </fieldset>
              </form>
            </div>
          </div>
        </div>
    </div>

There must just be some small mistake somewhere or something that I've missed in the HTML. Thanks in advance for any help.

Answer 1

Your fields don't have any name properties. Unnamed fields won't be passed to the PHP script when the form is submitted. Yopur inputs need a name property like this:

<input type="text" class="form-control" id="inputIGN" name="inputIGN" placeholder="In-game Name">

It's OK to use the same id and name

Your PHP script doesn't seem to make any attempt to read any passed variables, so it's not clear how you expect the form data to get to the email.

To read the input I illustrated above you can use:

$field_ign = $_POST['inputIGN'];

You'll need to do something similar for all your <input> and <textarea>

Answer 2

you don't have any name for your form input . name each input in form to post the data

<div class="container">
      <div class="well">
        <div class="row">
          <div class="col-lg-6">
            <div class="well">
              <form class="form-horizontal" action="" method="post">

                  <legend>Contact Us</legend>
                  <div class="form-group">
                    <label for="inputName" class="col-lg-2 control-label">Name</label>
                    <div class="col-lg-10">
                      <input type="text"  name="inputName" class="form-control" id="inputName" placeholder="Name">
                    </div>
                  </div>
                  <div class="form-group">
                    <label for="inputIGN"  class="col-lg-2 control-label">IGN</label>
                    <div class="col-lg-10">
                        <input type="text" name="inputIGN" class="form-control" id="inputIGN" placeholder="In-game Name">
                    </div>
                  </div>
                  <div class="form-group">
                    <label for="inputEmail" class="col-lg-2 control-label">Email</label>
                    <div class="col-lg-10">
                        <input type="text"  name="inputEmail" class="form-control" id="inputEmail" placeholder="Email">
                    </div>
                  </div>
                  <div class="form-group">
                        <label for="textArea" class="col-lg-2 control-label">Message</label>
                    <div class="col-lg-10">
                          <textarea class="form-control" rows="3" id="textArea"></textarea>
                      <span class="help-block">Please enter a real email address so that we can reply to your message.</span>
                    </div>
                  </div>
                  <div class="form-group">
                    <div class="col-lg-10 col-lg-offset-2">
                        <input type="submit" value="Save" name="submit"/>
                    </div>
                  </div>

              </form>
            </div>
          </div>
        </div>
    </div>