Welcome to the Treehouse Community

Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.

Start your free trial

PHP

Posted by Stu Cowley
Stu Cowley
26,287 Points

Form Won't Redirect

Hi everyone,

I am currently doing a project for a client and I am on the final part of coding out the contact form and I am using the contact form example in the "Build a Simple PHP Application" course. I know that this is probably a dated way to go about doing this but I have used the code from this project with no issues.

I'm using HTML and no PHP for the site, except for the contact-process.php, I have have this before and have had no problems until today.

I am using the below code and can get the values of each input field to display in the variable called "email_body", but I just can't seem to get the form to redirect to my thanks.html file, I have tried the .php extension and the form still does not redirect, I'm not sure what's happening here as I haven't used PHP like this a few couple of months and I am a bit rusty.

contact-process.php

<!-- Format the email -->
<pre>

<?php

$name = $_POST[ "name" ];
$email = $_POST[ "email" ];
$phone = $_POST[ "phone" ];
$message = $_POST[ "message" ];

$email_body = "";

## Echo out the values to display the form data
$email_body = $email_body . "Name: " . $name . "\n";
$email_body = $email_body . "Email: " . $email . "\n";
$email_body = $email_body . "Phone: " . $phone . "\n";
$email_body = $email_body . "Message: " . $message;

## Echo out the email body (for testing purposes)
echo $email_body;

## Things to do: Send the email

## Redirect to the "Thank You" page.
$section = "contact-us";
header("Location: contact-thanks.html");

?>

</pre>

Any advice on how I can get this up and working correctly will be greatly appreciated and I hope I have made sense on my problem.

Thanking you in advanced

Stu : )

EDIT: I have included the HTML code from both contact-us.html and contact-thanks.html

contact-us.html

<!DOCTYPE html>
<html>
   <head>
      <meta charset="utf-8">
      <meta http-equiv="X-UA-Compatible" content="IE=edge">
      <meta name="viewport" content="width=device-width, initial-scale=1">

      <title>Contact Us | Aquacaf Goolwa</title>

      <link rel="stylesheet" href="css/normalize.css">
      <link rel="stylesheet" href="js/pace/css/pace.css">
      <link rel="stylesheet" href="js/animsition/css/animsition.min.css">
      <link rel="stylesheet" href="js/slicknav/css/slicknav.css">

      <link rel="stylesheet" href="css/style.css">

      <link rel="icon" type="image/png" href="img/favicon.png">

      <!--[if lt IE 9]>
         <script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script>
         <script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
      <![endif]-->
   </head>
   <body class="animsition">
      <header class="main-header link-animation">
         <div class="container">
            <div class="row">
               <div class="col-3">
                  <a href="index.html"><img class="main-logo" src="img/logo-mono.jpg"></a>
               </div>
               <div class="col-6 text-center">
                  <ul class="main-nav" id="menu">
                     <li><a href="index.html">Home</a></li>
                     <li><a href="about-us.html">About Us</a></li>
                     <li><a href="menu.html">Menu</a></li>
                     <li><a href="contact-us.html">Contact</a></li>
                  </ul>
               </div>
               <div class="col-3 text-right hidden-mobile">
                  <ul class="nav-contact">
                     <li><a href="#"><span class="icon-facebook"></span></a></li>
                     <li><a href="#"><span class="icon-instagram"></span></a></li>
                     <li><a href="tel:+61885551235">8555 1235</a></li>
                  </ul>
               </div>
            </div>
         </div>
      </header>
      <section class="placard placard-lrg placard-contact-us">
         <div class="container">
            <h1>Contact Us</h1>
            <p>Simply call, email, or use the form below to get in touch.</p>
         </div>
      </section>
      <section class="page-text">
         <div class="container">
            <div class="row">
               <div class="col-8">
                  <h2>Contact Form</h2>
                  <form id="contact link-animation" class="contact-form" method="post" action="contact-processor.php">
                     <div class="row">
                        <div class="col-4">
                           <label for="name" class="form-label">Name</label>
                           <input id="name" class="form-input" type="text" name="name" placeholder="John Doe">
                        </div>
                        <div class="col-4">
                           <label for="email" class="form-label">Email Address</label>
                           <input id="email" class="form-input" type="text" name="email" placeholder="someone@example.com">
                        </div>
                        <div class="col-4">
                           <label for="phone" class="form-label">Phone Number</label>
                           <input id="phone" class="form-input" type="text" name="phone" placeholder="0412 345 667">
                        </div>
                     </div>
                     <div class="row">
                        <div class="col-12">
                           <label for="message" class="form-label">Message</label>
                           <textarea class="form-input" placeholder="Your message (please be nice)" rows="10" name="message"></textarea>
                           <button role="submit" value="send" class="btn btn-solid-red">Send</button>
                        </div>
                     </div>
                  </form>
               </div>
               <div class="col-4">
                  <h3>Finding Aquacaf</h3>
                  <p>94 Barrage Rd, Goolwa South, SA, 5214</p>
                  <h3>Contact Us</h3>
                  <ul>
                     <li><a class="link-animation text-light" href="mailto:aquacafgoolwa@gmail.com">aquacafgoolwa@gmail.com</a></li>
                     <li><a class="text-light" href="tel:85551235">(08) 8555 1235</a></li>
                  </ul>
               </div>
            </div>
         </div>
      </section>
      <footer>
         <div class="container">
            <div class="row">
               <div class="col-4">
                  <p>&copy; 2015 Aquacaf all rights reserved.</p>
               </div>
               <div class="col-4">
                  <ul class="footer-links link-animation">
                     <li><a href="index.html">Home</a></li>
                     <li><a href="about-us.html">About Us</a></li>
                     <li><a href="menu.html">Menu</a></li>
                     <li><a href="contact.html">Contact</a></li>
                  </ul>
               </div>
               <div class="col-4">
                  <p class="text-right link-animation">Design &amp; Code by <a href="#">Stu Cowley.</a></p>
               </div>
            </div>
         </div>
      </footer>


      <script src="js/jquery.min.js"></script>
      <script src="js/pace/pace.min.js"></script>
      <script src="js/animsition/js/animsition.min.js"></script>
      <script src="js/slicknav/slicknav.js"></script>
      <script src="js/site.js"></script>
   </body>
</html>

contact-thanks.html

<!DOCTYPE html>
<html>
   <head>
      <meta charset="utf-8">
      <meta http-equiv="X-UA-Compatible" content="IE=edge">
      <meta name="viewport" content="width=device-width, initial-scale=1">

      <title>Thanks! | Aquacaf Goolwa</title>

      <link rel="stylesheet" href="css/normalize.css">
      <link rel="stylesheet" href="js/pace/css/pace.css">
      <link rel="stylesheet" href="js/animsition/css/animsition.min.css">
      <link rel="stylesheet" href="js/slicknav/css/slicknav.css">

      <link rel="stylesheet" href="css/style.css">

      <link rel="icon" type="image/png" href="img/favicon.png">

      <!--[if lt IE 9]>
         <script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script>
         <script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
      <![endif]-->
   </head>
   <body class="animsition">
      <header class="main-header link-animation">
         <div class="container">
            <div class="row">
               <div class="col-3">
                  <a href="index.html"><img class="main-logo" src="img/logo-mono.jpg"></a>
               </div>
               <div class="col-6 text-center">
                  <ul class="main-nav" id="menu">
                     <li><a href="index.html">Home</a></li>
                     <li><a href="about-us.html">About Us</a></li>
                     <li><a href="menu.html">Menu</a></li>
                     <li><a href="contact-us.html">Contact</a></li>
                  </ul>
               </div>
               <div class="col-3 text-right hidden-mobile">
                  <ul class="nav-contact">
                     <li><a href="#"><span class="icon-facebook"></span></a></li>
                     <li><a href="#"><span class="icon-instagram"></span></a></li>
                     <li><a href="tel:+61885551235">8555 1235</a></li>
                  </ul>
               </div>
            </div>
         </div>
      </header>
      <section class="placard placard-lrg placard-contact-us">
         <div class="container">
            <h1>Contact Us</h1>
         </div>
      </section>
      <section class="page-text">
         <div class="container">
            <div class="row">
               <div class="col-8">
                  <h1>Contact Form</h1>
                  <p class="lead">Thank you for your message. We'll be in touch shortly.</p>
               </div>
               <div class="col-4">
                  <h3>Finding Aquacaf</h3>
                  <p>94 Barrage Rd, Goolwa South, SA, 5214</p>
                  <h3>Contact Us</h3>
                  <ul>
                     <li><a class="link-animation text-light" href="mailto:aquacafgoolwa@gmail.com">aquacafgoolwa@gmail.com</a></li>
                     <li><a class="text-light" href="tel:85551235">(08) 8555 1235</a></li>
                  </ul>
               </div>
            </div>
         </div>
      </section>
      <footer>
         <div class="container">
            <div class="row">
               <div class="col-4">
                  <p>&copy; 2015 Aquacaf all rights reserved.</p>
               </div>
               <div class="col-4">
                  <ul class="footer-links link-animation">
                     <li><a href="index.html">Home</a></li>
                     <li><a href="about-us.html">About Us</a></li>
                     <li><a href="menu.html">Menu</a></li>
                     <li><a href="contact.html">Contact</a></li>
                  </ul>
               </div>
               <div class="col-4">
                  <p class="text-right link-animation">Design &amp; Code by <a href="#">Stu Cowley.</a></p>
               </div>
            </div>
         </div>
      </footer>


      <script src="js/jquery.min.js"></script>
      <script src="js/pace/pace.min.js"></script>
      <script src="js/animsition/js/animsition.min.js"></script>
      <script src="js/slicknav/slicknav.js"></script>
      <script src="js/site.js"></script>
   </body>
</html>

2 Answers

Chris Jones
Chris Jones
9,385 Points
Chris Jones
Chris Jones
9,385 Points

Hey Stu,

You can't use "header" after an echo so if you comment out the line 

echo $email_body;

The redirect will work.

Also on the lines where you build your $email_body variable you could write it like so:

$email_body = "";

## Echo out the values to display the form data
$email_body .= "Name: " . $name . "\n";
$email_body .= "Email: " . $email . "\n";
$email_body .= "Phone: " . $phone . "\n";
$email_body .= "Message: " . $message;

And finally, I always use exit; after a header redirect so the script stops executing.

header("Location: contact-thanks.html");
exit;

EDIT: you should also take out the <pre> </pre> tags in your contact-process.php file.

Hope that helps, Chris.

Stu Cowley
Stu Cowley
26,287 Points

Hey Chris,

Your solution help me out! Thanks so much for that. Stupid me also overlooked the:

<!-- Format the email -->

After removing this it worked!

Thanks for your help mate, good to see a fellow Aussie using Treehouse!

Stu : )

Dale Bailey
Dale Bailey
20,269 Points
Dale Bailey
Dale Bailey
20,269 Points

In the html you have called contact-processor.php and earlier you say its called contact-process.php