How To Make This Form Work

Question

I've created this form for my website and linked the php but when i send the form i get the email but none of the info that was input into the form shows in the email, just the fields. im new to this so i apologise for the code not being the best.

Any help would be great.

<?PHP
 
 /* Subject & Email Variables */
 
 $emailSubject = 'Photography Quote';
 $webMaster = 'ryanandelissa@seawardphotography.com';
 
 /* Gathering Data Variables*/
 
 $firstname = $_POST['firstname'];
 $lastname = $_POST['lastname'];
 $email = $_POST['email'];
 $hdyhau = $_POST['hdyhau'];
 $message = $_POST['message'];
 
 $body = <<<EOD
<br><hr><br>
First Name: $firstname <br>
Last Name:  $lastname <br>
Email: $email <br>
How Did You Hear About Us?: $hdyhau <br>
Message: $message <br>
EOD;

 $headers = "From: $email\r\n";
 $headers .= "Content-type: text/html\r\n";
 $headers = mail($webMaster, $emailSubject, $body, $headers);
 
 /* Results Rendered As HTML */
 
 $theResults = <<<EOD
<html>
<head>
<title>Contact Us</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" type="text/css" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css">
<link rel="stylesheet" type="text/css" href="Contact.css">
<link href='http://fonts.googleapis.com/css?family=Lora' rel='stylesheet' type='text/css'>
<style type="text/css">
 
 /*logo*/

img{
 display: block;
 margin-left: auto;
 margin-right: auto;
 
}

/*navbar*/

#wrap{
 text-align: center;
 font-family: "Lora" serif;
 font-size: 13px;
 font-weight: normal;
 padding-right: 48px;
 padding-bottom: 40px;
 
}

.navbar li a{
 display: block;
}

.navbar li{
 display: inline-block;
 list-style: none;
 text-align: left;
 
}

.navbar a{
 text-decoration: none;
 color: #9c9c9c;
 display: block;
 padding: 8px;
 background-color: white;
}

.navbar li ul{
 position: absolute;
 display: none;
 margin: 0;
 padding: 0;
 height: auto;
 
}

.navbar li:hover, a:hover{
 color: black;
}

.navbar li:hover ul{
 display: block;
} 

.navbar li ul li {
 display: block;
}

h1{
 text-align: center;
 font-family: 'Lora' serif;
 font-size: 25px;
 padding-bottom: 30px;
}

input[type=button]{
 border: 2px solid #9c9c9c;
 background-color: white;
 color: #9c9c9c; 
 display: block;
 padding: 10px;
 width: 100px;
 margin-left: auto;
 margin-right: auto;
}

input[type=button]:hover{
 background-color: #9c9c9c;
 color: white;
 border: 2px #9c9c9c;
 padding: 10px;
 height: 41px;
}


/*footer*/

footer{
 text-align: center;
 font-family: "Lora" serif;
 font-size: 10px;
 font-weight: normal;
 padding-top: 30px;
}

 
    </style>
</head>
<body>
     <div class="container">
        <div class="row">
            <div class="col-sm-12 col-md-12">
             
             <img src="Images/NewLogoBlack.png" class="img-responsive" width="250px" height="250px">
         
         </div>
          <div class="clearfix visible-sm-block"></div>
      <div class="clearfix visible-md-block"></div>
       <div class="clearfix visible-lg-block"></div>
         
         
            <div class="col-sm-12 col-md-12">

   <div id="wrap">
   <ul class="navbar">
 
    <li><a href="index.html">HOME</a></li> 
   <li><a href="">PORTFOLIO</a>
   <ul>
      <li><a href="wedding.html">WEDDING</a></li>
      <li><a href="Love.html">LOVE</a></li>
      
   </ul>         
   </li>
   <li><a href="#">ABOUT</a>
   <ul>
      <li><a href="AboutUs.html">US</a></li>
   </ul>         
   </li>
   <li><a href="#">BLOG</a>
    <ul>
     <li><a href="NewBlogPage3.html">STORIES</a></li>
     <li><a href="Archive.html">ARCHIVE</a></li>
    </ul>
   </li>      
   <li><a href="Contact.html">CONTACT</a></li>
   </ul>   
   </div>   

             
</div>
<div class="clearfix visible-sm-block"></div>
<div class="clearfix visible-md-block"></div>
<div class="clearfix visible-lg-block"></div>
       
       
       
<div class="col-sm-12 col-md-12">
        
<h1>Thank you for your inquiry. We'll be in contact shortly.</h1>
        
</div>   
<div class="clearfix visible-sm-block"></div>
<div class="clearfix visible-md-block"></div>
<div class="clearfix visible-lg-block"></div>
       
<form action="Instagram.html">
<input type="button" value="HOME">
</form> 


<div class="clearfix visible-sm-block"></div>
<div class="clearfix visible-md-block"></div>
<div class="clearfix visible-lg-block"></div>
         
 
        
       
       
<div class="col-sm-12 col-md-12"><footer>All images Copyright © Seaward Photography 2016. Based in San Diego, California. Available for destinations worldwide.</footer></div>
<div class="clearfix visible-sm-block"></div>
<div class="clearfix visible-md-block"></div>
<div class="clearfix visible-lg-block"></div>

            




<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"</script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"
</body>
</html>
EOD;
echo($theResults);


            

?>

/*logo*/

img{
 display: block;
 margin-left: auto;
 margin-right: auto;
 
}

/*navbar*/

#wrap{
 text-align: center;
 font-family: "Lora" serif;
 font-size: 13px;
 font-weight: normal;
 padding-right: 48px;
 padding-bottom: 40px;
 
}

.navbar li a{
 display: block;
}

.navbar li{
 display: inline-block;
 list-style: none;
 text-align: left;
 
}

.navbar a{
 text-decoration: none;
 color: #9c9c9c;
 display: block;
 padding: 8px;
 background-color: white;
}

.navbar li ul{
 position: absolute;
 display: none;
 margin: 0;
 padding: 0;
 height: auto;
 
}

.navbar li:hover, a:hover{
 color: black;
}

.navbar li:hover ul{
 display: block;
} 

.navbar li ul li {
 display: block;
}

/*image*/

.contact img{
 width: 70%;
}


/* form */

.form label{
 padding-top: 30px;
 padding-left: 400px;
 display: block;
 float: right;
 padding-right: 189px;
 font-family: "Lora" serif;
 font-size: 12px;
 
}


input, textarea{
 font: 1em "Lora" sans-serif;
 width:300px;
 
 
}

textarea{
 vertical-align: top;
 height: 5em;
 resize: vertical;
 
}

input[type=submit]{
 border: 2px solid #9c9c9c;
 background-color: white;
 color: #9c9c9c; 
 display: block;
 padding: 10px;
 width: 100px;
 margin-left: auto;
 margin-right: auto;
}

input[type=submit]:hover{
 background-color: #9c9c9c;
 color: white;
 border: 2px #9c9c9c;
 padding: 10px;
 height: 44px;
}


/*footer*/

footer{
 text-align: center;
 font-family: "Lora" serif;
 font-size: 10px;
 font-weight: normal;
 padding-top: 10px;
 
}

<!DOCTYPE html>
<html>
<head>
<title>Contact Us</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" type="text/css" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css">
<link rel="stylesheet" type="text/css" href="Contact.css">
<link href='http://fonts.googleapis.com/css?family=Lora' rel='stylesheet' type='text/css'>
<style type="text/css">
 
 img{
  padding-bottom: 30px;
 }
 
 .contact-form{
  padding: 20px;
 }
 
 label{
  font-family: "Lora" serif;
  font-weight: 300;
 }
 
    </style>
</head>
<body>
     <div class="container">
        <div class="row">
            <div class="col-sm-12 col-md-12">
             
             <img src="Images/NewLogoBlack.png" class="img-responsive" width="250px" height="250px">
         
         </div>
          <div class="clearfix visible-sm-block"></div>
      <div class="clearfix visible-md-block"></div>
       <div class="clearfix visible-lg-block"></div>
         
         
            <div class="col-sm-12 col-md-12">

   <div id="wrap">
   <ul class="navbar">
 
    <li><a href="index.html">HOME</a></li> 
   <li><a href="">PORTFOLIO</a>
   <ul>
      <li><a href="wedding.html">WEDDING</a></li>
      <li><a href="Love.html">LOVE</a></li>
      
   </ul>         
   </li>
   <li><a href="#">ABOUT</a>
   <ul>
      <li><a href="AboutUs.html">US</a></li>
   </ul>         
   </li>
   <li><a href="#">BLOG</a>
    <ul>
     <li><a href="NewBlogPage3.html">STORIES</a></li>
     <li><a href="Archive.html">ARCHIVE</a></li>
    </ul>
   </li>      
   <li><a href="Contact.html">CONTACT</a></li>
   </ul>   
   </div>   

             
            </div>
             <div class="clearfix visible-sm-block"></div>
      <div class="clearfix visible-md-block"></div>
       <div class="clearfix visible-lg-block"></div>
 
 <div class="col-sm-12 col-md-12">
         <div class="img-list">    
             
          
    
      <img src="Images/ContactImage.jpg" class="img-responsive" width="750px" height="auto" />
          
      

         </div>    
            </div>
             <div class="clearfix visible-sm-block"></div>
             <div class="clearfix visible-md-block"></div>
       <div class="clearfix visible-lg-block"></div> 
       
       
               
        <form method="post" action="Contact%20Form.php" enctype="text/plain">
   <div class="contact-form">
    
         
     <div class="row"> 
  <div class="col-md-6 ">     
        <div class="form-group">
            <label for="firstname">First Name</label>
            <input type="text" class="form-control" id="firstname">
        </div>
        </div>
        <div class="col-md-6">
        <div class="form-group">
            <label for="lastname">Last Name</label>
            <input type="text" class="form-control" id="lastname">
        </div>
        </div>
        <div class="clearfix visible-md-block"></div>
        <div class="col-md-12">
        <div class="form-group">
            <label for="email">Email</label>
            <input type="email" class="form-control" id="email">
        </div>
        <div class="clearfix visible-md-block"></div>
        <div class="form-group">
            <label for="hdyhau">How Did You Hear About Us?</label>
            <input type="text" class="form-control" id="hdyhau">
        </div>
        <div class="form-group">
         <label for="message">Message</label>
            <textarea class="form-control" rows="4" id="message"></textarea>
            </div>  


        <div class="form-group">
        <div class="col-sm-8 col-sm-offset-2">
            <input id="submit" name="submit" type="submit" value="SEND!" class="btn btn-primary">
        </div>
    </div> 
     </div>   
    </form>

 
 
            <div class="col-sm-12 col-md-12"><footer>All images Copyright © Seaward Photography 2016. Based in San Diego, California. Available for destinations worldwide.</footer></div>
            <div class="clearfix visible-sm-block"></div>
             <div class="clearfix visible-md-block"></div>
       <div class="clearfix visible-lg-block"></div>

            




    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"</script>
    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"
</body>
</html>

I assume that other PHP pages/scripts work? As in, your server is setup and configured correctly to run PHP? — Davis, Mar 23 '16 at 19:16
2 thoughts: 1 - Does your PHP file name end in .php? 2 - Try making the opening tag lowercase like ` — mopo922, Mar 23 '16 at 19:24
You have errors: a `
` with no `action`, nested inside another `
`, missing end tags (for script etc.), bad values for `width` and `height` attributes in img elements, undefined values for `for` attributes in labels, and so on. Correct all the errors first and then check back here if the problems persist. — Mr Lister, Mar 23 '16 at 21:20
@Davis thank you for your help. i configured my server for php and i now get the email. But a new problem has arisen. when i get the email it doesn't show any of the information put into the form. could you help me with this too please? — R.Seaward, Mar 24 '16 at 20:59
@Davis i tried to do this but it doesn't seem to have fixed the problem. still getting blank emails come through... — R.Seaward, Mar 24 '16 at 23:49

Davis · Accepted Answer · 2016-03-25T00:21:47.240

1

Putting this in an answer so it can appear to have a resolution. ;)

Your code works for me (capitalized <?PHP and all (didn't seem to make a difference on my system)). You have some strangeness in your code (why assign your mail call to $headers?), but it seems fine, generally speaking (I even got the email). I think you have a server configuration issue.

Yes, the issue you mentioned in the comment is pretty simple, actually. In your form, your name attributes on your input elements are "firstname", "hdyhau", etc, but in your PHP you do this:

$firstnameField = !empty($_POST['firstname']) ? $_POST['firstname'] : 'n/a';
$lastnameField = $_POST['lastname'];
$emailField = $_POST['email'];
$hdyhauField = $_POST['hdyhau'];
$messageField = $_POST['messagename'];

but then reference them by their name value, not the variable you just copied them to:

    $body = <<<EOD
<br><hr><br>
First Name: $firstname <br>
Last Name:  $lastname <br>
Email: $email <br>
How Did You Hear About Us?: $hdyhau <br>
Message: $message <br>
EOD;

Just change what you assign them to $firstname instead of $firstnameField OR change the variable in your $body assignment to $firstnameField, etc.

You can verify that something was actually included in the form by doing something like this before your email:

$firstname = !empty($_POST['firstname']) ? $_POST['firstname'] : 'n/a';
...
$message = !empty($_POST['message']) ? $_POST['message'] : 'n/a';

Just make sure that the value you are accessing in $_POST matches the value you used in the name="" attribute of your form.

edited Mar 25 '16 at 00:21

answered Mar 24 '16 at 21:13

Davis

856
4
11

@R.Seaward, can you edit your original question with your code as it is now? I'll edit this answer with a way to verify that something is actually being passed and not the form being submitted without values in the form. – Davis Mar 25 '16 at 00:18
I've edited the above code to what i have now. hope this helps @Davis – R.Seaward Mar 25 '16 at 17:07
@R.Seaward Please keep in mind that since you inject your headers someone could turn your form into a spamming service. Please read [Escape string to use in mail()](http://stackoverflow.com/questions/8071916/escape-string-to-use-in-mail) to secure your form. – h2ooooooo Mar 25 '16 at 17:10
@R.Seaward, the email is completely blank? Nothing at all in it? Or just the fields supplied by the user? And h2ooooooo makes a good point; you may want to filter `$email` before you use it in the header, or even don't use their email address for the "from", just include it in `$message`, & take care when replying to them to use their email address from the body, instead of hitting "Reply" in your email client. – Davis Mar 25 '16 at 17:42
when the email sends, it just delivers the fields: First Name, Last Name etc etc but nothing that was actually written in the fields of the form @Davis ill be sure to reply using their actual email and not to the one they sent me. – R.Seaward Mar 25 '16 at 19:01

How To Make This Form Work

1 Answers1