Help with Email Form

nighttalker

1st post. 😃

I need help with a php script that wont quite work. I have an HTML form that sends information to my email, but my code has problems.
1) I can't figure out how to get required fields to work
2) The email it sends looks weird

I have a video, but I want information from people that watch it, so after successfully filling out the form they are directed to a page where they can watch the video.

So... without further ado, lets get to the code.

Heres the HTML form, pretty simple. It has name, address, city, state, phone, email fields. I want the name and email field to be required:

<html>
<title>
</title>
<style type="text/css">
<!--
.style1 {color: #FFFFFF}
-->
</style>
<body>
<form method="POST" action="mail.php">
   <table width="517" border="0" align="center">
     <tr>
       <td width="511" height="438"><table width="512" border="0">

     <tr>
       <td bgcolor="#680000" width="506"><h2 align="center" class="style1">Video Form </h2></td>
     </tr>
     <tr>
       <td bgcolor="#000000"><h4 align="center"><span class="formInfo style1">Please fill out this form to view the presentation.</span></h4></td>
     </tr>
<tr></tr>
       </table>
         <p>Name:<br>
           <input type="text" name="name" size="19">
         </p>
         <p>Address:<br>
           <input type="text" name="address" size="40" />
         </p>
         <p>City:<br>
           <input type="text" name="city" />
         </p>
         <p> State:<br>
           <select class=mainForm name=state id=field_4>
             <option value=''> </option>
             <option value="Alabama">Alabama</option>
             <option value="Alaska">Alaska</option>
             <option value="Arizona">Arizona</option>
             <option value="Arkansas">Arkansas</option>
             <option value="California">California</option>
             <option value="Colorado">Colorado</option>
             <option value="Connecticut">Connecticut</option>
             <option value="Delaware">Delaware</option>
             <option value="Florida">Florida</option>
             <option value="Georgia">Georgia</option>
             <option value="Hawaii">Hawaii</option>
             <option value="Idaho">Idaho</option>
             <option value="Illinois">Illinois</option>
             <option value="Indiana">Indiana</option>
             <option value="Iowa">Iowa</option>
             <option value="Kansas">Kansas</option>
             <option value="Kentucky">Kentucky</option>
             <option value="Louisiana">Louisiana</option>
             <option value="Maine">Maine</option>
             <option value="Maryland">Maryland</option>
             <option value="Massachusetts">Massachusetts</option>
             <option value="Michigan">Michigan</option>
             <option value="Minnesota">Minnesota</option>
             <option value="Mississippi">Mississippi</option>
             <option value="Missouri">Missouri</option>
             <option value="Montana">Montana</option>
             <option value="Nebraska">Nebraska</option>
             <option value="Nevada">Nevada</option>
             <option value="New Hampshire">New Hampshire</option>
             <option value="New Jersey">New Jersey</option>
             <option value="New Mexico">New Mexico</option>
             <option value="New York">New York</option>
             <option value="North Carolina">North Carolina</option>
             <option value="North Dakota">North Dakota</option>
             <option value="Ohio">Ohio</option>
             <option value="Oklahoma">Oklahoma</option>
             <option value="Oregon">Oregon</option>
             <option value="Pennsylvania">Pennsylvania</option>
             <option value="Rhode Island">Rhode Island</option>
             <option value="South Carolina">South Carolina</option>
             <option value="South Dakota">South Dakota</option>
             <option value="Tennessee">Tennessee</option>
             <option selected=""value="Texas">Texas</option>
             <option value="Utah">Utah</option>
             <option value="Vermont">Vermont</option>
             <option value="Virginia">Virginia</option>
             <option value="Washington">Washington</option>
             <option value="West Virginia">West Virginia</option>
             <option value="Wisconsin">Wisconsin</option>
             <option value="Wyoming">Wyoming</option>
           </select>
         </p>
         <p>Phone:<br>
           <input type="text" name="phone" />
         </p>
         <p>Email:<br>
           <input type="text" name="email" size="19">
           <br>
           <br>
           <br>
           <br>
           <input type="submit" value="Submit" name="submit">
       </p>       </td>
     </tr>
   </table>
</form>
</body>
</html>

And heres the PHP code:

<?php
if(isset($_POST['submit'])) {
require ('name') ;
$to = "email@gmail.com";
$subject = "Test";
$name_field = $_POST['name']; 
$address_field = $_POST['address'];
$city_field = $_POST['city'];
$state_field = $_POST['state'];
$phone_field = $_POST['phone'];
$email_field = $_POST['email']; 
$url = 'thankyou.html' ;


$body = "From: $name_field\n Address: $address_field/n City: $city_field/n State: $state_field/n Phone: $phone_field/n E-Mail: $email_field\n ";

echo '<META HTTP-EQUIV=Refresh CONTENT="0; URL='.$url.'">' ;
mail($to, $subject, $body);
} else {
echo "Something was entered incorrectly please go back and try again.";
}
?>

I've tried methods online to make fields required but I can't quite figure it out. When I try, the form ends up accepting even when I enter nothing in.

halojoy

A few things.

require('name');
this is supposed to include a page 'name' without extension
Maybe there is such a page. But it looks strange to me.

in your $body = "...."
you have several times the bad "/n" when the correct is "\n"

You can not have one redirect META HTTP-EQUIV=Refresh
before the line: mail($to, $subject.......)
Because it will send the viewer away BEFORE the mail is sent.

Why the submitted stuff is accepted every time
is because you have no validating done in this script.
No check for empty $_POST fields, for example.

<?php

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

require ('name') ;

$to = "email@gmail.com";
$subject = "Test";
$name_field = $_POST['name'];
$address_field = $_POST['address'];
$city_field = $_POST['city'];
$state_field = $_POST['state'];
$phone_field = $_POST['phone'];
$email_field = $_POST['email'];
$url = 'thankyou.html' ;


$body = "From: $name_field\n Address: $address_field\n City: $city_field\n 
State: $state_field\n Phone: $phone_field\n E-Mail: $email_field\n";

//send the mail
mail($to, $subject, $body);

// send the user to $url THANK YOU
echo '<META HTTP-EQUIV=Refresh CONTENT="0; URL='.$url.'">' ;
exit();

} else {
echo "Something was entered incorrectly please go back and try again.";
}

?>

steven1978

I think you have misunderstood the require statement for a start, it has nothing to do with required fields, it is used to include another file in your script.

Anyway, from what I can tell all you are trying to do is stop the form from being submitted if the name or email field has not been filled out. The best way to do this is using javascript to check the fields before the form is submitted to PHP. Its quite simple, just set the onsubmit value for the form as a javascript function that will check these fields and only return true if the fields are filled out. Otherwise it will return false and the form will not be submitted.

See the updated code, this is a really simple implementation and there are much better and thorough ways to do this. Once you have it working and understand it, you might want to learn a bit about javascript as there are much more advanced ways to do this kind of thing. Also I would suggest adding some PHP validation in the script that your form is submitted to, just to check that the data being posted is what is expected.

steven1978

<html>

<head>

<title>
</title>

<style type="text/css">
<!--
.style1 {color: #FFFFFF}
-->
</style>

<script type="text/javascript">

	function validate(form) {
		var name = document.getElementById("name");
		var email = document.getElementById("email");

		if (name.value == null || name.value == '') {
			alert("Name cannot be left blank!");
			return false;
		}
		else if (email.value == null || email.value == '') {
			alert("Email cannot be left blank!");
			return false;
		}
		else {
			return true;
		}
	}

</script>

</head>

<body>

     <tr>
       <td bgcolor="#680000" width="506"><h2 align="center" class="style1">Video Form </h2></td>
     </tr>
     <tr>
       <td bgcolor="#000000"><h4 align="center"><span class="formInfo style1">Please fill out this form to view the presentation.</span></h4></td>
     </tr>
	<tr></tr>
   </table>
     <p>Name:<br>
       <input type="text" name="name" id="name" size="19">
     </p>
     <p>Address:<br>
       <input type="text" name="address" size="40" />
     </p>
     <p>City:<br>
       <input type="text" name="city" />
     </p>
     <p> State:<br>
       <select class=mainForm name=state id=field_4>
         <option value=''> </option>
         <option value="Alabama">Alabama</option>
         <option value="Alaska">Alaska</option>
         <option value="Arizona">Arizona</option>
         <option value="Arkansas">Arkansas</option>
         <option value="California">California</option>
         <option value="Colorado">Colorado</option>
         <option value="Connecticut">Connecticut</option>
         <option value="Delaware">Delaware</option>
         <option value="Florida">Florida</option>
         <option value="Georgia">Georgia</option>
         <option value="Hawaii">Hawaii</option>
         <option value="Idaho">Idaho</option>
         <option value="Illinois">Illinois</option>
         <option value="Indiana">Indiana</option>
         <option value="Iowa">Iowa</option>
         <option value="Kansas">Kansas</option>
         <option value="Kentucky">Kentucky</option>
         <option value="Louisiana">Louisiana</option>
         <option value="Maine">Maine</option>
         <option value="Maryland">Maryland</option>
         <option value="Massachusetts">Massachusetts</option>
         <option value="Michigan">Michigan</option>
         <option value="Minnesota">Minnesota</option>
         <option value="Mississippi">Mississippi</option>
         <option value="Missouri">Missouri</option>
         <option value="Montana">Montana</option>
         <option value="Nebraska">Nebraska</option>
         <option value="Nevada">Nevada</option>
         <option value="New Hampshire">New Hampshire</option>
         <option value="New Jersey">New Jersey</option>
         <option value="New Mexico">New Mexico</option>
         <option value="New York">New York</option>
         <option value="North Carolina">North Carolina</option>
         <option value="North Dakota">North Dakota</option>
         <option value="Ohio">Ohio</option>
         <option value="Oklahoma">Oklahoma</option>
         <option value="Oregon">Oregon</option>
         <option value="Pennsylvania">Pennsylvania</option>
         <option value="Rhode Island">Rhode Island</option>
         <option value="South Carolina">South Carolina</option>
         <option value="South Dakota">South Dakota</option>
         <option value="Tennessee">Tennessee</option>
         <option selected=""value="Texas">Texas</option>
         <option value="Utah">Utah</option>
         <option value="Vermont">Vermont</option>
         <option value="Virginia">Virginia</option>
         <option value="Washington">Washington</option>
         <option value="West Virginia">West Virginia</option>
         <option value="Wisconsin">Wisconsin</option>
         <option value="Wyoming">Wyoming</option>
       </select>
     </p>
     <p>Phone:<br>
       <input type="text" name="phone" />
     </p>
     <p>Email:<br>
       <input type="text" name="email" id="email"  size="19">
       <br>
       <br>
       <br>
       <br>
       <input type="submit" value="Submit" name="submit">
   </p>       </td>
 </tr>

</table>
</form>

</body>

</html>

steven1978

I think you have misunderstood the require statement for a start, it has nothing to do with required fields, it is used to include another file in your script.

This is the code you need, I have added a javascript section to the head of your page with a function that checks the required fields. I also added 'id' attributes to the required form elements so that I could then check them using 'getElementById'. Any questions don't hesitate.

<html>

<head>

<title>
</title>

<style type="text/css">
<!--
.style1 {color: #FFFFFF}
-->
</style>

<script type="text/javascript">

	function validate() {
		var name = document.getElementById("name");
		var email = document.getElementById("email");

		if (name.value == null || name.value == '') {
			alert("Name cannot be left blank!");
			return false;
		}
		else if (email.value == null || email.value == '') {
			alert("Email cannot be left blank!");
			return false;
		}
		else {
			return true;
		}
	}

</script>

</head>

<body>

<form method="POST" action="mail.php" onsubmit="return validate()">
   <table width="517" border="0" align="center">
     <tr>
       <td width="511" height="438"><table width="512" border="0">

     <tr>
       <td bgcolor="#680000" width="506"><h2 align="center" class="style1">Video Form </h2></td>
     </tr>
     <tr>
       <td bgcolor="#000000"><h4 align="center"><span class="formInfo style1">Please fill out this form to view the presentation.</span></h4></td>
     </tr>
	<tr></tr>
   </table>
     <p>Name:<br>
       <input type="text" name="name" id="name" size="19">
     </p>
     <p>Address:<br>
       <input type="text" name="address" size="40" />
     </p>
     <p>City:<br>
       <input type="text" name="city" />
     </p>
     <p> State:<br>
       <select class=mainForm name=state id=field_4>
         <option value=''> </option>
         <option value="Alabama">Alabama</option>
         <option value="Alaska">Alaska</option>
         <option value="Arizona">Arizona</option>
         <option value="Arkansas">Arkansas</option>
         <option value="California">California</option>
         <option value="Colorado">Colorado</option>
         <option value="Connecticut">Connecticut</option>
         <option value="Delaware">Delaware</option>
         <option value="Florida">Florida</option>
         <option value="Georgia">Georgia</option>
         <option value="Hawaii">Hawaii</option>
         <option value="Idaho">Idaho</option>
         <option value="Illinois">Illinois</option>
         <option value="Indiana">Indiana</option>
         <option value="Iowa">Iowa</option>
         <option value="Kansas">Kansas</option>
         <option value="Kentucky">Kentucky</option>
         <option value="Louisiana">Louisiana</option>
         <option value="Maine">Maine</option>
         <option value="Maryland">Maryland</option>
         <option value="Massachusetts">Massachusetts</option>
         <option value="Michigan">Michigan</option>
         <option value="Minnesota">Minnesota</option>
         <option value="Mississippi">Mississippi</option>
         <option value="Missouri">Missouri</option>
         <option value="Montana">Montana</option>
         <option value="Nebraska">Nebraska</option>
         <option value="Nevada">Nevada</option>
         <option value="New Hampshire">New Hampshire</option>
         <option value="New Jersey">New Jersey</option>
         <option value="New Mexico">New Mexico</option>
         <option value="New York">New York</option>
         <option value="North Carolina">North Carolina</option>
         <option value="North Dakota">North Dakota</option>
         <option value="Ohio">Ohio</option>
         <option value="Oklahoma">Oklahoma</option>
         <option value="Oregon">Oregon</option>
         <option value="Pennsylvania">Pennsylvania</option>
         <option value="Rhode Island">Rhode Island</option>
         <option value="South Carolina">South Carolina</option>
         <option value="South Dakota">South Dakota</option>
         <option value="Tennessee">Tennessee</option>
         <option selected=""value="Texas">Texas</option>
         <option value="Utah">Utah</option>
         <option value="Vermont">Vermont</option>
         <option value="Virginia">Virginia</option>
         <option value="Washington">Washington</option>
         <option value="West Virginia">West Virginia</option>
         <option value="Wisconsin">Wisconsin</option>
         <option value="Wyoming">Wyoming</option>
       </select>
     </p>
     <p>Phone:<br>
       <input type="text" name="phone" />
     </p>
     <p>Email:<br>
       <input type="text" name="email" id="email"  size="19">
       <br>
       <br>
       <br>
       <br>
       <input type="submit" value="Submit" name="submit">
   </p>       </td>
 </tr>
   </table>
</form>

</body>

</html>

dagon

steven1978;10950674 wrote:
The best way to do this is using javascript to check the fields before the form is submitted to PHP.

javascript is client side and therefore can be disabled, so you must always check with php even if you choose to use javascript first.

steven1978

In reply to the last post, I did also mention that some PHP validation should also be used. In my experience, both are necessary.

"Also I would suggest adding some PHP validation in the script that your form is submitted to, just to check that the data being posted is what is expected."

steven1978

Also I believe that it is the best way to validate. It will work for about 98% of users on the web, and the rest who disable javascript can look forward to most of the web not working very well for them. Personally I would prefer to use both, and also disable elements of the site for users without javascript enabled by simply displaying the form dynamically using javascript. Those users without it enabled would simply see a message warning them that javascript was necessary to use the site, the message would be replaced with javascript requiring content for those with it enabled. Its just my opinion I know, but these people need to come into the present!