need a little bit of help with a basic html form

mrbios

mrbios

mrbios

Soldato
Joined
7 Jun 2003
Posts
16,189
Location
Gloucestershire
Just created a little form in html, it emails the results of the form to me but i want to be able to set the Title of the email via the form, is this possible?

At the moment the email just comes through as "Form posted from web browser" which is a bit pants

EDIT: another question, if i have <fieldset> in there how do i stop the fieldset from stretching across the entire the page if i only want it to surround, in this case, a table?
 
Last edited:
ringo747 said:
What code are you using? Are you using the php mail function presumably?
Click to expand...

Standard html, ive never done any web coding in my life, bar a TINY bit of html stuff at college years and years ago so bare with me :p, this is what the start of the form looks like at the moment:
<form action="MAILTO:***********" method="post" enctype="text/plain">

Then a submit button at the end of the form

Really i want to be able to completely change the way the output in the email is, is there any way to do that? having it looking like this is crap:

Student Name=
Tutor Group=
Staff Member=
Date of Incident=
Subject=
Period=
C1 Explanation=
C2 Explanation=
C3 Explanation=
Time sent to BfL Center=
Signed=

I'd rather have some proper formatting in place
 
You are probably best submitting the form to a PHP script. You could set the title field in the PHP code. I am no pro but I have some code here somewhere that I can dig out. It will validate your form too to make sure everything is filled in properly.
 
Ok this is what i have now:

Code: 
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>C3 REFERRAL FORM</title>
<style type="text/css">
body,td,th {
	font-family: Verdana, Geneva, sans-serif;
}
</style>
</head>

<body>
<form action="MAILTO:**************?Subject=C3 Referral Form" method="post" enctype="text/plain">

  <h1 align="center">C3 REFERRAL FORM</h1>
  <p>This form is to be completed if a student chooses to be sent to the BfL Centre and <strong>MUST BE COMPLETED <u>THE SAME DAY</u>.</strong>  </p>
  <table width="793" height="280" border="0">
    <tr>
    <th width="125" height="85">Name of Student:</th>
    <td width="233"><input name="Student Name" type="text" value="" size="40" /></td>
    <th width="120">Tutor Group:</th>
    <td width="278"><input name="Tutor Group" type="text" size="40" /></td>
  </tr>
  <tr>
    <th height="93">Staff Member:</th>
    <td><input name="Name" type="text" size="40" /></td>
    <th>Date of Incident:</th>
    <td><input name="Date of Incident" type="text" size="40" /></td>
  </tr>
  <tr>
    <th height="94">Subject:</th>
    <td><input name="Subject" type="text" size="40" /></td>
    <th>Period:</th>
    <td><input name="Period" type="text" size="40" /></td>
  </tr>
</table>
  <p>Reasons why the warnings were given: </p>
    <td><table width="792" height="465" border="1" cellspacing="5">
      <tr>
        <th width="76" scope="col">&nbsp;</th>
        <th width="80" scope="col"><p>Rule
          Broken</p></th>
        <th width="602" scope="col">Explanation of Incidents</th>
      </tr>
      <tr>
        <th height="121" scope="row">C1</th>
        <td><center>
          <label for="textfield"></label>
          <textarea name="C1 Rules broken" cols="9" rows="8" id="textfield"></textarea>
        </center></td>
        <td><label for="textarea"></label>
          <textarea name="C1 Explanation" id="C1 Explanation" cols="90" rows="8"></textarea></td>
      </tr>
      <tr>
        <th height="139" scope="row">C2</th>
        <td><center>
          <label for="checkbox4"></label>
          <label for="textfield2"></label>
          <textarea name="C2 Rules broken" cols="9" rows="8" id="textfield2"></textarea>
        </center></td>
        <td><textarea name="C2 Explanation" id="C2 Explanation" cols="90" rows="8"></textarea></td>
      </tr>
      <tr>
        <th height="138" scope="row">C3</th>
        <td><center>
          <label for="checkbox5"></label>
          <label for="textfield3"></label>
          <textarea name="C3 Rules broken" cols="9" rows="8" id="textfield3"></textarea>
        </center></td>
        <td><textarea name="C3 Explanation" id="C3 Explanation" cols="90" rows="8"></textarea></td>
      </tr>
    </table></td>
  </tr>
  </table>
  <p>&nbsp;</p>
  <p>Exact time sent to BfL Centre:
    <input name="Time sent to BfL Center" type="text" size="27" /> 
  </p>
  <p></p>
 <p>  	Signed:		<input name="Signed" type="text" size="59" /> </p>
 <p>&nbsp;</p>
<input type="submit" value="submit" />
</form>
<p>&nbsp;</p>
</body>
</html>

some of the code at the bottom seems to have chucked itself all higgledy piggledy but never mind that.... That now sends me an email with the correct title, but i think i definately would like to get a form to mail script to work with it, i'll be hosting it in IIS and i don't have php installed on the webserver, any other recommendations on scripts? if anyone could knock me something up and tell me how to get it to work i would greatly appreciate it!

EDIT: i think what i really want, is for that form, as it looks in a print preview, do be sent as an email in the same layout and look as it does in the print preview window, that may be asking a bit much but is it possible?
 
Last edited:
You can probably use ASP or ASP.Net, best to search Google for "ASP form to email" or similar.

Another option would be to use a third party form system, something like WuFoo

http://wufoo.com/

They take care of all the technical bits and just give you a WYSIWYG form builder.
 
Hey man, I just built a contact form and after a lot of googling found this great tutorial which does everything you want (I think) using jquery and a php scrip to submit the form.

If you want to just use the code you can but you can also work through it and then tweak it to your needs.

Hope this helps you, it helped me. :)

EDIT: Forgot to include a link! DOH!

http://www.raymondselda.com/php-contact-form-with-jquery-validation/
 
Last edited:
Hi MrBios, Just thought I should point out that if you are using mailto: , if the user hasn't got an email client installed they wont be able to contact you.

Best bet is with server side scripting.
 
Thanks for the responses, i'll give pieploughs suggestion a go first, no doubt i'll reply tomorrow when i run into problems :p
 
Ok, this is proving a little better, looks better too.....

I now have the following:
Code: 
<?php
//If the form is submitted
if(isset($_POST['submit'])) {

	//Check to make sure that the name field is not empty
	if(trim($_POST['contactname']) == '') {
		$hasError = true;
	} else {
		$name = trim($_POST['contactname']);
	}

	//Check to make sure that the subject field is not empty
	if(trim($_POST['subject']) == '') {
		$hasError = true;
	} else {
		$subject = trim($_POST['subject']);
	}

	//Check to make sure sure that a valid email address is submitted
	if(trim($_POST['email']) == '')  {
		$hasError = true;
	} else if (!eregi("^[A-Z0-9._%-]+@[A-Z0-9._%-]+\.[A-Z]{2,4}$", trim($_POST['email']))) {
		$hasError = true;
	} else {
		$email = trim($_POST['email']);
	}

	//Check to make sure comments were entered
	if(trim($_POST['message']) == '') {
		$hasError = true;
	} else {
		if(function_exists('stripslashes')) {
			$comments = stripslashes(trim($_POST['message']));
		} else {
			$comments = trim($_POST['message']);
		}
	}

	//If there is no error, send the email
	if(!isset($hasError)) {
		$emailTo = **************; //Put your own email address here
		$body = "Name: $name \n\nEmail: $email \n\nSubject: $subject \n\nComments:\n $comments";
		$headers = 'C3 Referral Form <'.$emailTo.'>' . "\r\n" . 'Reply-To: ' . $email;

		mail($emailTo, $subject, $body, $headers);
		$emailSent = true;
	}
}
?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
        "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">

<head>
	<title>C3 Referral Form</title>
	<meta http-equiv="content-type" content="text/html;charset=utf-8" />
	<meta http-equiv="Content-Style-Type" content="text/css" />

	<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js" type="text/javascript"></script>
	<script src="jquery.validate.pack.js" type="text/javascript"></script>

<script type="text/javascript">
$(document).ready(function(){
	$("#contactform").validate();
});
</script>

	<style type="text/css">
body {
	font-family:Arial, Tahoma, sans-serif;
}
#contact-wrapper {
	width:870px;
	border:1px solid #e2e2e2;
	background:#f1f1f1;
	padding:20px;
}
#contact-wrapper div {
	clear:both;
	margin:1em 0;
}
#contact-wrapper label {
	display:block;
	float:none;
	font-size:16px;
	width:auto;
}
form#contactform input {
	border-color:#B7B7B7 #E8E8E8 #E8E8E8 #B7B7B7;
	border-style:solid;
	border-width:1px;
	padding:5px;
	font-size:16px;
	color:#333;
}
form#contactform textarea {
	font-family:Arial, Tahoma, Helvetica, sans-serif;
	font-size:100%;
	padding:0.6em 0.5em 0.7em;
	border-color:#B7B7B7 #E8E8E8 #E8E8E8 #B7B7B7;
	border-style:solid;
	border-width:1px;
}
	</style>
</head>

<body>
<div id="contact-wrapper">

<?php if(isset($hasError)) { //If errors are found ?>
	<p class="error">Please check if you've filled all the fields with valid information. Thank you.</p>
<?php } ?>

<?php if(isset($emailSent) && $emailSent == true) { //If email is sent ?>
	<p><strong>Successfully Sent!</strong></p>
<?php } ?>

<form method="post" action="<?php echo $_SERVER['PHP_SELF']; ?>" id="contactform">
	<div>
	    <label for="name"><strong>Name of Student:</strong></label>
		<input type="text" size="50" name="contactname" id="contactname" value="" class="required" />
    </div>
    <div>
        <label for="email"><strong>Tutor Group:</strong></label>
		<input type="text" size="50" name="Tutor Group" id="Tutor group" value="" class="required" />
	</div>

	<div>
		<label for="email"><strong>Staff Member:</strong></label>
		<input type="text" size="50" name="Staff member" id="Staff Member" value="" class="required" />
	</div>

	<div>
		<label for="subject"><strong>Date of Incident:</strong></label>
		<input type="text" size="50" name="Date of Incident" id="Date of incident" value="" class="required" />
	</div>

	<div>
		<label for="message"><strong>Period:</strong></label>
		<input type="text" size="50" name="Period" id="Period" value="" class="required" />
	</div>
    <div>
		<label for="message"><strong>Subject:</strong></label>
		<input type="text" size="50" name="Subject" id="Subject" value="" class="required" />
	</div>
    
    <table width="740" height="227" border="1">
  <tr>
    <th width="40" height="62" scope="col">&nbsp;</th>
    <th width="59" scope="col">Rule Broken</th>
    <th width="619" scope="col">Explanation of Incident</th>
  </tr>
  <tr>
    <th height="89" scope="row">C1</th>
    <td><textarea name="C1 Rule Broken" cols="10" rows="5" class="required" id="C1 Rule Broken"></textarea></td>
    <td>
      <textarea name="C1 Explanation" cols="100" rows="5" class="required" id="C1 Explanation"></textarea>
</td>
  </tr>
  <tr>
    <th scope="row">C2</th>
    <td><textarea name="C2 Rule Broken" cols="10" rows="5" class="required" id="C2 Rule Broken"></textarea></td>
    <td><textarea name="C2 Explanation" cols="100" rows="5" class="required" id="C2 Explanation"></textarea></td>
  </tr>
  <tr>
    <th scope="row">C3</th>
    <td><textarea name="C3 Rule Broken" cols="10" rows="5" class="required" id="C3 Rule Broken"></textarea></td>
    <td><textarea name="C3 Explanation" cols="100" rows="5" class="required" id="C3 Explanation"></textarea></td>
  </tr>
</table>
 <div>
		<label for="message"><strong>Exact time sent to BfL:</strong></label>
		<input type="text" size="50" name="Time Sent to BFL" id="Time Sent to BFL" value="" class="required" />
	</div>
        <div>
		<label for="message"><strong>Signed:</strong></label>
		<input type="text" size="50" name="Signed" id="Signed" value="" class="required" />
	</div>
    <p>
      <input type="submit" value="Send Message" name="submit" />
    </p>
</form>
</div>
</body>
</html>

I currently have two issues... The first bein that i can't seem to get two boxes on the same line (i don't really want them all one after the other) and the second that putting data in and clicking "send message" just gives me "please check if you've filled all the fields with valid information. thank you" i assume it's still checking for a valid email in what was previously the "email" field, but i thought i had removed that

*bangs head on desk*

EDIT:

I've used this: <div style="width:400px"> to make the div sections smaller, now it looks like they should be able to fit side by side but don't know what i need to do with the code to sit them side by side

EDIT2:

Ok i wanted to get rid of the field requirment checking so it now looks like this, but i've tested it and it isn't sending emails, what do i need to edit in order to make it send the mail?

Code: 
<?php
//If the form is submitted
if(isset($_POST['submit'])) {

	//Check to make sure that the name field is not empty
	if(trim($_POST['contactname']) == '') {
		$hasError = true;
	} else {
		$name = trim($_POST['contactname']);
	}

	//If there is no error, send the email
	if(!isset($hasError)) {
		$emailTo = '*******************'; //Put your own email address here
		$body = "Name: $name \n\nEmail: $email \n\nSubject: $subject \n\nComments:\n $comments";
		$headers = 'C3 Referral Form <'.$emailTo.'>' . "\r\n" . 'Reply-To: ' . $email;

		mail($emailTo, $subject, $body, $headers);
		$emailSent = true;
	}
}
?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
        "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">

<head>
	<title>C3 Referral Form</title>
	<meta http-equiv="content-type" content="text/html;charset=utf-8" />
	<meta http-equiv="Content-Style-Type" content="text/css" />

	<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js" type="text/javascript"></script>
	<script src="jquery.validate.pack.js" type="text/javascript"></script>

<script type="text/javascript">
$(document).ready(function(){
	$("#contactform").validate();
});
</script>

	<style type="text/css">
body {
	font-family:Arial, Tahoma, sans-serif;
}
#contact-wrapper {
	width:880px;
	border:1px solid #e2e2e2;
	background:#f1f1f1;
	padding:20px;
}
#contact-wrapper div {
	clear:both;
	margin:1em 0;
}
#contact-wrapper label {
	display:block;
	float:none;
	font-size:16px;
	width:auto;
}
form#contactform input {
	border-color:#B7B7B7 #E8E8E8 #E8E8E8 #B7B7B7;
	border-style:solid;
	border-width:1px;
	padding:5px;
	font-size:16px;
	color:#333;
}
form#contactform textarea {
	font-family:Arial, Tahoma, Helvetica, sans-serif;
	font-size:100%;
	padding:0.6em 0.5em 0.7em;
	border-color:#B7B7B7 #E8E8E8 #E8E8E8 #B7B7B7;
	border-style:solid;
	border-width:1px;
}
	</style>
</head>

<body>
<div id="contact-wrapper">
  <p class="error">&nbsp;</p>
  <form method="post" action="<?php echo $_SERVER['PHP_SELF']; ?>" id="contactform">
<div style="width:400px">
	    <label for="Nme of Student"><strong>Name of Student:</strong></label>
		<input type="text" size="50" name="contactname" id="contactname" value="" />
    </div>
    <div style="width:400px">
        <label for="Tutor Group"><strong>Tutor Group:</strong></label>
		<input type="text" size="50" name="Tutor Group" id="Tutor group" value="" />
	</div>

	<div style="width:400px">
		<label for="Staff Member"><strong>Staff Member:</strong></label>
		<input type="text" size="50" name="Staff member" id="Staff Member" value="" />
	</div>

	<div style="width:400px">
		<label for="Date of Incident"><strong>Date of Incident:</strong></label>
		<input type="text" size="50" name="Date of Incident" id="Date of incident" value="" />
	</div>

	<div style="width:400px">
		<label for="Period"><strong>Period:</strong></label>
		<input type="text" size="50" name="Period" id="Period" value="" />
	</div>
    <div style="width:400px">
		<label for="Subject"><strong>Subject:</strong></label>
		<input type="text" size="50" name="Subject" id="Subject" value="" />
	</div>
    
    <table width="740" height="227" border="1">
  <tr>
    <th width="40" height="62" scope="col">&nbsp;</th>
    <th width="59" scope="col">Rule Broken</th>
    <th width="619" scope="col">Explanation of Incident</th>
  </tr>
  <tr>
    <th height="89" scope="row">C1</th>
    <td><textarea name="C1 Rule Broken" cols="10" rows="5" id="C1 Rule Broken"></textarea></td>
    <td>
      <textarea name="C1 Explanation" cols="100" rows="5" id="C1 Explanation"></textarea>
</td>
  </tr>
  <tr>
    <th scope="row">C2</th>
    <td><textarea name="C2 Rule Broken" cols="10" rows="5" id="C2 Rule Broken"></textarea></td>
    <td><textarea name="C2 Explanation" cols="100" rows="5" id="C2 Explanation"></textarea></td>
  </tr>
  <tr>
    <th scope="row">C3</th>
    <td><textarea name="C3 Rule Broken" cols="10" rows="5" id="C3 Rule Broken"></textarea></td>
    <td><textarea name="C3 Explanation" cols="100" rows="5" id="C3 Explanation"></textarea></td>
  </tr>
</table>
<div style="width:400px">
		<label for="Excat Time sent to BFL"><strong>Exact time sent to BfL:</strong></label>
		<input type="text" size="50" name="Time Sent to BFL" id="Time Sent to BFL" value="" />
	</div>
<div>
		<label for="Signed"><strong>Signed:</strong></label>
		<input type="text" size="50" name="Signed" id="Signed" value="" />
	</div>
    <p>
      <input type="submit" value="Send Message" name="submit" />
    </p>
</form>
</div>
</body>
</html>


Chopped the top bit down even more, still doesn't work though:
Code: 
<?php
//If the form is submitted
if(isset($_POST['submit'])) {
		$emailTo = '[email protected]'; //Put your own email address here
		$headers = 'C3 Referral Form <'.$emailTo.'>';

		mail($emailTo, $headers);
		$emailSent = true;
	}
?>
 
Last edited:
UncleRuckus said:
Are you running from localhost or hosting?
Click to expand...

Running it from a web server on a domain which contains exchange, the email problem is now resolved :D

Had some guidance from elsewhere, edited the php.ini with SMTP details and also created an SMTP recieve connecter on my exchange server, so now i come to my next issue :D

The code now looks like this:
Code: 
<?php
//If the form is submitted
if(isset($_POST['submit'])) {
		$emailTo = '[email protected]'; //Put your own email address here
		$subject="C3 Referral Form";
		$body = "Name: $name \n\n";
		$headers = "From: " . $emailTo . "\r\nReply-To: " . $emailTo;

		mail($emailTo, $subject, $body, $headers);

		$emailSent = true;
	}
?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
        "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">

<head>
	<title>C3 Referral Form</title>
	<meta http-equiv="content-type" content="text/html;charset=utf-8" />
	<meta http-equiv="Content-Style-Type" content="text/css" />

	<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js" type="text/javascript"></script>
	<script src="jquery.validate.pack.js" type="text/javascript"></script>

<script type="text/javascript">
$(document).ready(function(){
	$("#contactform").validate();
});
</script>

	<style type="text/css">
body {
	font-family:Arial, Tahoma, sans-serif;
}
#contact-wrapper {
	width:880px;
	border:1px solid #e2e2e2;
	background:#f1f1f1;
	padding:20px;
}
#contact-wrapper div {
	clear:both;
	margin:1em 0;
}
#contact-wrapper label {
	display:block;
	float:none;
	font-size:16px;
	width:auto;
}
form#contactform input {
	border-color:#B7B7B7 #E8E8E8 #E8E8E8 #B7B7B7;
	border-style:solid;
	border-width:1px;
	padding:5px;
	font-size:16px;
	color:#333;
}
form#contactform textarea {
	font-family:Arial, Tahoma, Helvetica, sans-serif;
	font-size:100%;
	padding:0.6em 0.5em 0.7em;
	border-color:#B7B7B7 #E8E8E8 #E8E8E8 #B7B7B7;
	border-style:solid;
	border-width:1px;
}
	</style>
</head>

<body>
<div id="contact-wrapper">
  <form method="post" action="<?php echo $_SERVER['PHP_SELF']; ?>" id="contactform">
<div style="width:400px">
	    <label for="Name of Student"><strong>Name of Student:</strong></label>
		<input type="text" size="50" name="contactname" id="contactname" value="" />
    </div>
    <div style="width:400px">
        <label for="Tutor Group"><strong>Tutor Group:</strong></label>
		<input type="text" size="50" name="Tutor Group" id="Tutor group" value="" />
	</div>

	<div style="width:400px">
		<label for="Staff Member"><strong>Staff Member:</strong></label>
		<input type="text" size="50" name="Staff member" id="Staff Member" value="" />
	</div>

	<div style="width:400px">
		<label for="Date of Incident"><strong>Date of Incident:</strong></label>
		<input type="text" size="50" name="Date of Incident" id="Date of incident" value="" />
	</div>

	<div style="width:400px">
		<label for="Period"><strong>Period:</strong></label>
		<input type="text" size="50" name="Period" id="Period" value="" />
	</div>
    <div style="width:400px">
		<label for="Subject"><strong>Subject:</strong></label>
		<input type="text" size="50" name="Subject" id="Subject" value="" />
	</div>
    
    <table width="740" height="227" border="1">
  <tr>
    <th width="40" height="62" scope="col">&nbsp;</th>
    <th width="59" scope="col">Rule Broken</th>
    <th width="619" scope="col">Explanation of Incident</th>
  </tr>
  <tr>
    <th height="89" scope="row">C1</th>
    <td><textarea name="C1 Rule Broken" cols="10" rows="5" id="C1 Rule Broken"></textarea></td>
    <td>
      <textarea name="C1 Explanation" cols="100" rows="5" id="C1 Explanation"></textarea>
</td>
  </tr>
  <tr>
    <th scope="row">C2</th>
    <td><textarea name="C2 Rule Broken" cols="10" rows="5" id="C2 Rule Broken"></textarea></td>
    <td><textarea name="C2 Explanation" cols="100" rows="5" id="C2 Explanation"></textarea></td>
  </tr>
  <tr>
    <th scope="row">C3</th>
    <td><textarea name="C3 Rule Broken" cols="10" rows="5" id="C3 Rule Broken"></textarea></td>
    <td><textarea name="C3 Explanation" cols="100" rows="5" id="C3 Explanation"></textarea></td>
  </tr>
</table>
<div style="width:400px">
		<label for="Excat Time sent to BFL"><strong>Exact time sent to BfL:</strong></label>
		<input type="text" size="50" name="Time Sent to BFL" id="Time Sent to BFL" value="" />
	</div>
<div>
		<label for="Signed"><strong>Signed:</strong></label>
		<input type="text" size="50" name="Signed" id="Signed" value="" />
	</div>
    <p>
      <input type="submit" value="Submit C3" name="submit" />
    </p>
</form>
</div>
</body>
</html>

When it emails me, again, it looks very basic! so now i want some way of formatting the email to make it a similar layout and look as the form does, possible?

At the moment the email just emails me the word "Name:" and nothing else, i assume this is to do with the contents in the very beginning piece of code after $body?
 
Last edited:
Just thought i would show off the finished product as im suitably impressed with it :D

All the CSS needs chopping up as i just copied it from our intranet site though it seems to work :p (apart from editing CSS before ive never created any so im not sure how to make it from scratch)

Code: 
<?php
//If the form is submitted
if(isset($_POST['submit'])) {
		$name = trim($_POST['Student']);
		$tutor = trim($_POST['TutorGroup']);
		$staff = trim($_POST['StaffMember']);
		$doi = trim($_POST['DateofIncident']);							
		$ExplainInc = trim($_POST['ExplainInc']);	
		$Time = trim($_POST['Time']);
		$gum = trim($_POST['gum']);
		$phone = trim($_POST['phone']);										
		$swearing = trim($_POST['swearing']);	
		$litter = trim($_POST['litter']);	
		$uniform = trim($_POST['uniform']);	
		$eating = trim($_POST['eating']);
		$respect = trim($_POST['respect']);
		$running = trim($_POST['running']);
		$refuse = trim($_POST['refuse']);
		$shouting = trim($_POST['shouting']);
		$pushing = trim($_POST['pushing']);
		$smoking = trim($_POST['smoking']);
		$offsite = trim($_POST['offsite']);
		$emailTo = '***********';
		$subject="C3 for poor choices outside of the lesson";
		$headers = "From: " . $emailTo . "\r\nReply-To: " . $emailTo;
		$headers .= 'MIME-Version: 1.0' . "\r\n";
		$headers .= 'Content-type: text/html; charset=iso-8859-1' . "\r\n";
		$message = '
		<html>
		<head>
			<title>C3 for poor choices outside of the lesson</title>
		</head>
		<body>
		<h1 align="center"><strong>C3 for poor choices outside of the lesson</strong></h1>
<table width="700" height="224" border="0">
  <tr>
    <th width="123" height="60" scope="col"><div align="left">Name of Student:</div></th>
    <td width="259" scope="col">' . $name . '</td>
    <th width="114" scope="col"><div align="left">Tutor Group:</div></th>
    <td width="269" scope="col">' . $tutor . '</td>
  </tr>
  <tr>
    <th height="60" scope="row"><div align="left">Staff Member:</div></th>
    <td>' . $staff . '</td>
    <th><div align="left">Date of Incident:</div></th>
    <td>' . $doi . '</td>
  </tr>
  <tr>
    <th width="212" height="60" scope="col"><div align="left">Time:</div></th>
    <td>' . $Time . '</td>
  </tr>
</table>
<table width="700" height="199" border="1">
  <tr>
    <th width="227" scope="row"><div align="left">Chewing Gum</div></th>
    <td width="211">' . $gum . '</td>
    <th width="87"><div align="left">Swearing</div></th>
    <td width="347">' . $swearing . '</td>
  </tr>
  <tr>
    <th scope="row"><div align="left">Mobile phones/mp3/ipods
      headphones visable in lesson</div></th>
    <td>' . $phone . '</td>
    <th><div align="left">Littering</div></th>
    <td>' . $litter . '</td>
  </tr>
  <tr>
    <th scope="row"><div align="left">Eating in the classroom</div></th>
    <td>' . $eating . '</td>
    <th><div align="left">Uniform</div></th>
    <td>' . $uniform . '</td>
  </tr>
    <tr>
    <th scope="row"><div align="left">Lack of respect to all staff</div></th>
    <td>' . $respect . '</td>
    <th><div align="left">Running</div></th>
    <td>' . $running . '</td>
  </tr>
    <tr>
    <th scope="row"><div align="left">Refusing to follow instructions</div></th>
    <td>' . $refuse . '</td>
    <th><div align="left">Shouting</div></th>
    <td>' . $shouting . '</td>
  </tr>
    <tr>
    <th scope="row"><div align="left">Pushing into queues including getting someone else to buy their food</div></th>
    <td>' . $pushing . '</td>
    <th><div align="left">Smoking</div></th>
    <td>' . $smoking . '</td>
  </tr>
    <tr>
    <th scope="row"><div align="left">Off site during break/lunchtime without permission</div></th>
    <td>' . $offsite . '</td>
  </tr>
</table>
<table width="700" height="341" border="1">
  <tr>
    <th width="79" height="75" scope="col">Breif Explanation of Incident:</th>
    <td width="670" scope="col">' . $ExplainInc . '</td>
  </tr>
</table>
		</body>
		</html>
		';

		mail($emailTo, $subject, $message, $headers);

		$emailSent = true;
	}
?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
        "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">

<head>
	<title>C3 for poor choices outside of the lesson</title>
	<meta http-equiv="content-type" content="text/html;charset=utf-8" />
	<meta http-equiv="Content-Style-Type" content="text/css" />

	<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js" type="text/javascript"></script>
	<script src="jquery.validate.pack.js" type="text/javascript"></script>

<script type="text/javascript">
$(document).ready(function(){
	$("#contactform").validate();
});
</script>

 	<style type="text/css">
/* ----------------------------------------------
   HTML ELEMENTS
------------------------------------------------- */ 

/* Top Elements */
* { margin: 0; padding: 0; outline: 0 }

body {
	background: #d5ea8e url(/media/1062/bg.gif) repeat-x;
	font: 12px/170% 'Lucida Grande', 'Lucida Sans Unicode', Geneva, Verdana, sans-serif;
	color: #666666; 
	text-align: center;	
}

/* links */
a, a:visited {	
	color: #306495;
	background: inherit;
	text-decoration: none;
}
a:hover {
	color: #73471B;
	background: inherit;
	text-decoration: underline;
}

/* headers */
h1, h2, h3 {
	font-family: 'Trebuchet MS', 'Helvetica Neue', Arial, Sans-serif;
	font-weight: Bold; 	
	padding: 10px;		
	color: #444;	
}
h1 {
	font-size: 2.2em;		
}
h2 {
	font-size: 2em;
	color: #88ac0b;
}
h3 {
	font-size: 1.4em;
	font-weight: normal;	
	padding: 16px 10px 4px 10px;
}

/* Paragraph */
p { padding: 12px 10px;	}

/* Lists */
ul, ol {
	margin: 10px 20px;
	padding: 0 20px;	
}
ul { list-style: none; }

dl { padding: 10px; margin: 0; }

dt {
  font-weight: bold;
  color: #79A62E;
}
dd {
  padding-left: 25px; 
}

/* images */
img {
	background: #EDF8C7;
   border: 1px solid #EDF8C7;
	padding: 7px;
}
img.float-right {
  	margin: 5px 0px 10px 10px;  
}
img.float-left {
  	margin: 5px 10px 10px 0px;
}

code {
  	margin: 5px 0;
  	padding: 0px;
  	text-align: left;
  	display: block;
  	overflow: auto;  
  	font: 500 1em/1.5em 'Lucida Console', 'Courier New', monospace ;
  	/* white-space: pre; */
  	border: 1px solid #deedae; 
	background: #EDF8C7; 
}
acronym {
  cursor: help;
  border-bottom: 1px dotted #895F30;
}
blockquote {
	margin: 15px 10px;
 	padding: 5px 7px 5px 40px;  	
   font-weight: normal;
	font-size: 17px;
	line-height: 1.6em;
	font-style: italic;
	font-family: Georgia, 'Times New Roman', Times, serif;		
	color: #80614D;	
	border: 1px solid #DFF4B5; 
	background: #F0FFD2 url(/media/1072/quote.gif) no-repeat 7px 10px;
}

/* start - table */
table {
	border-collapse: collapse;
	margin: 15px 10px;		
}
th {
	height: 38px;
	padding-left: 12px;
	padding-right: 12px;
	color: #fff;
	text-align: left;
	background: #ADD163;	
	border-width: 1px;
  	border-style: solid;
  	border-color: #C4DE8F #93C138 #93C138 #C4DE8F;	
}
tr {
	height: 34px;
	background: #fff;
}
td {
	padding-left: 11px;
	padding-right: 11px;
	border: 1px solid #E7F0CC;	
}	
/* end - table */

/* form elements */
/*as shipped in template form {
	margin: 15px 10px; 
	padding: 5px 10px 20px 10px;
	border: 1px solid #D8E99E; 
	background: #deedae; 	
}*/
/* as hacked by ed*/
form {
	background:#EDF8C7 url(/media/1064/content.gif) repeat-y scroll 0 0;
	border:0 solid #D8E99E;
	margin:0;
	padding:5px 10px 20px;
}
label {
	display: block;
	font-weight: bold;
	margin: 8px 0 5px 0;
	color: #895F30;
}
input, textarea, select {
	padding: 4px;
	color: #666666;		
	background: #fff;
	
  	border-width: 1px;
  	border-style: solid;
  	border-color: #d4d4d4 #ebebeb #ebebeb #d4d4d4; 
	
	font: normal 11px Verdana, sans-serif;
}
textarea {
	width: 400px;	
	height: 100px;
	display: block;	
}
input.button { 
	font: bold 12px Arial, Sans-serif; 
	height: 30px;
	margin: 0;
	padding: 2px 3px; 
	color: #fff;
	background: #A6CD56;
	
	border-width: 1px;
  	border-style: solid;
  	border-color: #C4DE8F #8DB836 #8DB836 #C4DE8F;
}


/********************************************
   LAYOUT
********************************************/ 
#wrap {
	position: relative;
	width: 920px;
	background: #edf8c7 url(/media/1075/wrap.gif) repeat-y center top;
	margin: 35px auto;
	text-align: left;	
}
#content-wrap {
	position: relative;
	clear: both;
	float: left;	
	width: 920px;	
	padding: 25px 0; 	
	background: #edf8c7 url(/media/1064/content.gif) repeat-y;	
}
#header {
	position: relative;
	width: 920px;
	height: 205px;
	background: #317cb1 url(/media/1068/header.gif) no-repeat;	
	color: #fff;	
	padding: 0;	
	margin: 0;
}
#header h1#logo-text a {
	position: absolute;
	margin: 0; padding: 0;
	font: bold 56px 'Trebuchet MS', 'Helvetica Neue', Arial, Sans-serif;
	letter-spacing: -3px;
	text-decoration: none;
	color: #fff;
	
	/* change the values of top and left to adjust the position of the logo*/
	top: 58px; left: 55px;	
}
#header p#slogan {
	position: absolute;
	margin: 0; padding: 0;
	font: bold 15px 'Trebuchet MS', 'Helvetica Neue', Arial, Sans-serif;
	color: #D6EBAB;
	letter-spacing: -0.5px;
	
	/* change the values of top and left to adjust the position of the slogan*/
	top: 122px; left: 135px;		
}

/* header quick search */
#header form#quick-search {
	position: absolute;
	top: 75px; right: 55px;
	padding: 0; margin: 0;
	border: none;
	width: 223px; height: 33px;
	background: #82c7f4 url(/media/1069/header-search.gif) no-repeat;	
	z-index: 999999;
}
#header form#quick-search p {
	margin: 0; padding: 0;		
}
#header form#quick-search input {
	border: none;
	background: transparent;
	color: #0e5792;
	float: left;
}
#header form#quick-search .tbox {
	margin: 5px 0 0 5px; 
	width: 170px;	
	display: inline;	
}
#search form#quick-search .btn{
	width: 25px; height: 25px;		
}
#header form#quick-search label {
	display: none;
}

/* Navigation */
#nav {
	clear: both;	
	padding: 0;	margin: 0;
	width: 920px;
	height: 50px;
	background: #EDF8C7 url(/media/1070/nav.gif) no-repeat;		
}
#nav ul {
	float: left;
	list-style: none;	
	margin: 0;
	padding: 0 0 0 40px;			
	height: 50px;	
}
#nav ul li {
	display: inline;
	margin: 0; padding: 0;
}
#nav ul li a {
	display: block;
	float: left;
	width: 112px;
	margin: 0;
	padding: 0 84px;
	color: #fff;
	font: bold 15px/50px 'Trebuchet MS', 'Helvetica Neue', Arial, sans-serif;
	text-decoration: none;	
	letter-spacing: -0.5px;
}
#nav ul li a:hover, 
#nav ul li a:active {
	color: #edf8c7;	
}
#nav ul li.Selected a {	
	background: #0c4e80 url(/media/1071/pointer.gif) no-repeat center bottom;	
	color: #93DAFF;
}

/* Main Column */
#main {
	float: left;
	width: 795px;
	padding: 0; margin: 0 0 0 45px;
	display: inline;	
}
#main h2 {
	font: bold 2.25em 'Trebuchet MS', 'Helvetica Neue', Arial, Sans-serif;
	color: #115280; 
	padding: 10px 0 5px 5px; 	
	margin-left: 5px;		
	letter-spacing: -1px;
	border-bottom: 1px solid #D2E9A4;
}
#main h2 a {
	color: #115280;
	text-decoration: none;		
}
#main ul li {
	list-style-image: url(/media/1063/bullet.gif);
}

#sidebar {
	float: right;
	width: 1px;
	padding: 0; 
	margin: 0 45px 0 0;
	display: inline;	
}
#sidebar h3 {
	color: #115280; 
	font: normal 1.6em 'Trebuchet MS', 'Helvetica Neue', Arial, Sans-serif;
	text-transform: none;
	padding: 10px 0 2px 0; 
	margin: 10px 0 0 10px; 
}

/* sidebar menu */
#sidebar .sidemenu {
	margin: 5px 10px 8px 7px; padding: 0;
	text-decoration: none;		
	border-top: 2px solid #D0E89F;
}
#sidebar .sidemenu li {
	list-style: none;
	margin: 0;
	padding: 7px 10px; 			
	border-bottom: 1px solid #DAEBA3;	
}
* html body #sidebar .sidemenu li {
	height: 1%;
}
#sidebar .sidemenu li a {
	text-decoration: none;	
	color: #684F3E;	
}
#sidebar .sidemenu li a span {
	color: #A98D76;	
	font-size: .9em;
	
	font-family: Georgia, 'Times New Roman', Times, serif;
	font-style: italic;
	font-weight: normal;		
}
#sidebar .sidemenu li a:hover {	
	color: #000;	
	background: none;	
}
#sidebar .sidemenu ul { margin: 0 0 0 5px; padding: 0; }
#sidebar .sidemenu ul li { border: none; }

#sidebar #NewsList  {
	margin: 5px 10px 8px 7px; padding: 0;
	text-decoration: none;		
	border-top: 2px solid #D0E89F;
}
#sidebar #NewsList  li {
	list-style: none;
	margin: 0;
	padding: 7px 10px; 			
	border-bottom: 1px solid #DAEBA3;	
}
* html body #sidebar #NewsList  li {
	height: 1%;
}
#sidebar #NewsList  li a {
	text-decoration: none;	
	color: #684F3E;	
}
#sidebar #NewsList  li a span {
	color: #A98D76;	
	font-size: .9em;
	
	font-family: Georgia, 'Times New Roman', Times, serif;
	font-style: italic;
	font-weight: normal;		
}
#sidebar #NewsList  li a:hover {	
	color: #000;	
	background: none;	
}
#sidebar #NewsList  ul { margin: 0 0 0 5px; padding: 0; }
#sidebar #NewsList  ul li { border: none; }


/* search form */
#sidebar .searchform {
	background-color: transparent;
	border: none;	
	margin: 0 0 0 5px; 
	padding: 10px 0 10px 10px;	
	width: 260px;	
}
#sidebar .searchform p { margin: 0; padding: 0; }
#sidebar .searchform input.textbox { 
	width: 180px;
	height: 18px;
	padding: 2px;	
	vertical-align: top;
}
#sidebar .searchform input.button { 
	width: 60px;
	height: 24px;
	padding: 2px 4px;
	vertical-align: top;
}

/* footer */
#footer-wrap {
	clear: both;
	width: 950px;
	text-align: left;
	padding: 0;	margin: 0;
	background: url(/media/1066/footer-bottom.gif) no-repeat left bottom;		
}
#footer-content {
	width: 950px;
	background: url(/media/1067/footer-top-sep.gif) no-repeat;	
	padding: 30px 0 35px 0;
}

#footer-wrap p {
	padding:10px 0;
}
#footer-wrap h3 {
	color: #145F94; 
	margin: 0;
	padding: 5px 0 5px 10px; 
	text-transform: uppercase;
}
#footer-wrap a:hover { 
	color: #000; 
	text-decoration: none;
}

#footer-columns {
	color: #888;
	margin: 0 auto; 
	padding: 0;	
	width: 800px;		
}
#footer-columns ul {
	list-style: none;
	margin: 0; 
	padding: 0;	
	border-top: 1px solid #BFD286;
}
#footer-columns li {
	border-bottom: 1px solid #CCDA9E;		
}
#footer-columns li a {
	display: block;
	font-weight: normal;
	padding: 8px 0 8px 10px;
	width: 96%;
	color: #666666;	
}

#footer-columns .col3, .col3-center {
	float: left;
	width: 32%;
}
#footer-columns .col3-center { 
	margin: 0 15px; 
}

/* bottom */
#footer-bottom {
	clear: both;
	color: #555;	
	margin: 0 auto; 
	width: 920px;
	padding: 15px 0 10px 0;
	text-align: center;	
	font-size: 0.95em;
}
#footer-bottom a { color: #306495; }

/* postmeta */
.post-footer {
	padding: 8px 5px; 
	margin: 5px 10px 10px 10px;	
	color: #A2745D;
	border: 1px solid #deedae; 
	background: #F0FFD2;
}
.post-footer .date{ margin: 0 10px 0 5px;	}
.post-footer a.comments { margin: 0 10px 0 5px;	}
.post-footer a.readmore { margin: 0 10px 0 5px;	}

.post-info { font-size: .95em; padding: 0 10px; margin-left: 2px; color: #A98D76; }
.post-info a, .post-info a:visited { color: #9C652E; }

/* alignment classes */
.float-left  { float: left; }
.float-right { float: right; }
.align-left  { text-align: left; }
.align-right { text-align: right; }

/* clearing */
.clearer { clear: both; }
.clear {	display:inline-block; }
.clear:after {
	display:block; 
	visibility:hidden; 
	clear:both; 
	height:0; 
	content: "."; 
}

	</style>
</head>

<body>
<h1 align="center"><u>C3 for poor choices outside of the lesson</u></h1>

<div id="contact-wrapper">

<form method="post" action="<?php echo $_SERVER['PHP_SELF']; ?>" id="contactform">
  <table width="900" height="260" border="0" align="center">
  <tr>
    <td width="402" scope="col">
	    <label for="Name of Student">
	      <div align="left"><strong>Name of Student:</strong></div>
	    </label>
		<div align="left">
		  <input type="text" size="50" name="Student" id="Student" value="" />
	    </div></td>
    <td width="396" scope="col">
        <label for="Tutor Group">
          <div align="left"><strong>Tutor Group:</strong></div>
        </label>
		<div align="left">
		  <input type="text" size="50" name="TutorGroup" id="Tutorgroup" value="" />
	    </div></td>
  </tr>
  <tr>
    <td scope="row">
		<label for="Staff Member">
		  <div align="left"><strong>Staff Member:</strong></div>
		</label>
		<div align="left">
		  <input type="text" size="50" name="StaffMember" id="StaffMember" value="" />
	    </div></td>
    <td>
		<label for="Date of Incident">
		  <div align="left"><strong>Date of Incident:</strong></div>
		</label>
		<div align="left">
		  <input type="text" size="50" name="DateofIncident" id="Dateofincident" value="" />
	    </div></td>
  </tr>
  <tr>
    <td scope="row">
<label for="Exact Time sent to BFL">
  <div align="left"><strong>Time:</strong>
</label>
<div align="left">
  <input type="text" size="50" name="Time" id="Time" value="" />
</div>
    </div>	</td>
    <td>
      <div align="left"></div></td>
  </tr>
</table>
  <table width="900" height="373" border="0" align="center">
    <tr>
    <th width="415" scope="row"><div align="left">Chewing Gum:</div></th>
    <td width="151"><div align="center">
      <input name="gum" type="checkbox" id="gum" value="Yes" />
    </div>
      <label for="gum"></label></td>
    <th width="162"><div align="left">Swearing:</div></th>
    <td width="154"><div align="center">
      <input name="swearing" type="checkbox" id="swearing" value="Yes" />
    </div>
      <label for="swearing"></label></td>
  </tr>
  <tr>
    <th scope="row"><div align="left">Mobile phones/mp3/ipods
      headphones visable in lesson:</div></th>
    <td><div align="center">
      <input name="phone" type="checkbox" id="phone" value="Yes" />
    </div>
      <label for="phone"></label></td>
    <th><div align="left">Littering:</div></th>
    <td><div align="center">
      <input name="litter" type="checkbox" id="litter" value="Yes" />
    </div>
      <label for="litter"></label></td>
  </tr>
  <tr>
    <th scope="row"><div align="left">Eating in the classroom:</div></th>
    <td><div align="center">
      <input name="eating" type="checkbox" id="eating" value="Yes" />
    </div>
      <label for="eating"></label></td>
    <th><div align="left">Uniform:</div></th>
    <td><div align="center">
      <input name="uniform" type="checkbox" id="uniform" value="Yes" />
    </div>
      <label for="uniform"></label></td>
  </tr>
  <tr>
    <th height="51" scope="row"><div align="left">Lack of respect to all staff:</div></th>
    <td><div align="center">
      <input name="respect" type="checkbox" id="respect" value="Yes" />
    </div>      <label for="respect"></label>    </td>
    <th><div align="left">Running:</div></th>
    <td><div align="center">
      <input name="running" type="checkbox" id="running" value="Yes" />
    </div>
      <label for="running"></label></td>
  </tr>
  <tr>
    <th scope="row"><div align="left">Refusing to follow instructions:</div></th>
    <td><div align="center">
      <input name="refuse" type="checkbox" id="refuse" value="Yes" />
    </div>      <label for="refuse"></label>    </td>
    <th><div align="left">Shouting:</div></th>
    <td><div align="center">
      <input name="shout" type="checkbox" id="shout" value="Yes" />
    </div>
      <label for="shout"></label></td>
  </tr>
  <tr>
    <th scope="row"><div align="left">Pushing into queues including getting someone else to buy their food:</div></th>
    <td><div align="center">
      <input name="pushing" type="checkbox" id="pushing" value="Yes" />
    </div>      <label for="pushing"></label>    </td>
    <th><div align="left">Smoking:</div></th>
    <td><div align="center">
      <input name="smoking" type="checkbox" id="smoking" value="Yes" />
    </div>
      <label for="smoking"></label></td>
  </tr>
  <tr>
    <th scope="row"><div align="left">Off site during break/lunchtime without permission:</div></th>
    <td><input name="offsite" type="checkbox" id="offsite" value="Yes" />
      <label for="offsite"></label></td>
    <th>&nbsp;</th>
    <td>&nbsp;</td>
  </tr>
  </table>
  <table width="900" height="110" border="1" align="center">
    <tr>
    <th width="79" height="104" scope="col"><div align="left">Brief Explanation of Incident:</div></th>
    <th width="670" scope="col"><textarea name="ExplainInc" cols="120" rows="10" id="C"></textarea></th>
  </tr>
</table>

	<p>
	  <input type="submit" value="Submit C3 for Outside" name="submit" />
	</p>
</form>
</div>
</body>
</html>

5 forms in total, 4 of them do pretty much the same as the one in my code there ^ but the 5th one is bit different:

Code: 
<?php
//If the form is submitted
if(isset($_POST['submit'])) {
		$name = trim($_POST['name']);
		$dept = trim($_POST['dept']);
		$papercolour = trim($_POST['papercolour']);
		$Date = trim($_POST['Date']);
		$quantity = trim($_POST['quantity']);
		$datereq = trim($_POST['datereq']);										
		$size = trim($_POST['size']);	
		$hole = trim($_POST['hole']);	
		$stapled = trim($_POST['stapled']);
		$folded = trim($_POST['folded']);
		$special = trim($_POST['special']);	
		$emailTo = '***************';
		$subject="Reprographics Requests";
		$headers = "From: " . $emailTo . "\r\nReply-To: " . $emailTo;
		$headers .= 'MIME-Version: 1.0' . "\r\n";
		$headers .= 'Content-type: text/html; charset=iso-8859-1' . "\r\n";
		$message = '
		<html>
			<head>
				<title>Reprograhics Request</title>
			</head>
		<body>
			<h1 align="center"><strong>Reprographics Request</strong></h1>
			<table width="793" height="224" border="0">
 				 <tr>
  					<th width="123" height="60" scope="col"><div align="left">Name:</div></th>
   					<td width="259" scope="col">' . $name . '</td>
    				<th width="114" scope="col"><div align="left">Department:</div></th>
   					<td width="269" scope="col">' . $dept . '</td>
  				</tr>
 				<tr>
    				<th height="60" scope="row"><div align="left">Paper Colour:</div></th>
    					<td>' . $papercolour . '</td>
    				<th><div align="left">Date:</div></th>
    					<td>' . $Date . '</td>
  				</tr>
  				<tr>
    				<th height="60" scope="row"><div align="left">Quantity:</div></th>
    					<td>' . $quantity . '</td>
    				<th><div align="left">Date Required:</div></th>
    					<td>' . $datereq . '</td>
  				</tr>
    			<tr>
    				<th width="212" height="60" scope="col"><div align="left">Size:</div></th>
    					<td>' . $size . '</td>
					<th><div align="left">Hole Punched:</div></th>
    					<td>' . $hole . '</td>
  				</tr>
    			<tr>
    				<th height="60" scope="row"><div align="left">Stapled:</div></th>
    					<td>' . $stapled . '</td>
    				<th><div align="left">Folded:</div></th>
   						<td>' . $folded . '</td>
  				</tr>
			</table>
			<table width="700" height="341" border="1">
  				<tr>
    				<th width="79" height="75" scope="col">Special Instructions:</th>
    					<td width="670" scope="col">' . $special . '</td>
  				</tr>
			</table>
					<center><a href="http:\\webapps02:802\uploads\\' . $_FILES['uploadedfile']['name'] . '">Link to file</a>

		</body>
		</html>
';

		mail($emailTo, $subject, $message, $headers);

		$emailSent = true;

		$target_path = "uploads/";   
		$target_path = $target_path . basename( $_FILES['uploadedfile']['name']);
		$file = $_FILES['uploadedfile'];

		$allowedExtensions = array("txt", "rtf", "doc", "docx", "txt", "pdf", "xls", "xlsx", "ppt", "pptx", "pub", "pubx");

		function isAllowedExtension($fileName) {
  		global $allowedExtensions;

  		return in_array(end(explode(".", $fileName)), $allowedExtensions);
		}

		$ok=1;
	//Condition to return error or upload
		if($file['error'] == UPLOAD_ERR_OK) {
  		if(isAllowedExtension($file['name'])) {
    //This is our size condition 
   		if ($uploadedfile_size > 350000) { echo "Your file is too large.<br>"; $ok=0; }
    //Here we check that $ok was not set to 0 by an error 
    	if ($ok==0) { Echo "Sorry your file was not uploaded"; } 
    //If everything is ok we try to upload it else 
    { if(move_uploaded_file($_FILES['uploadedfile']['tmp_name'], $target_path)) { echo "The file ". basename( $_FILES['uploadedfile']['name']). " has been uploaded"; }
    	else { echo "Sorry, there was a problem uploading your file."; } } 
  				} else {
   		echo "Invalid file type";
 				}
			} else die("Cannot upload"); 
	}
?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
        "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">

	<head>
		<title>Reprographics Request Form</title>
		<meta http-equiv="content-type" content="text/html;charset=utf-8" />
		<meta http-equiv="Content-Style-Type" content="text/css" />

		<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js" type="text/javascript"></script>
		<script src="jquery.validate.pack.js" type="text/javascript"></script>
		<script type="text/javascript">
			$(document).ready(function(){
			$("#contactform").validate();
			});
		</script>

 	<style type="text/css">
/* ----------------------------------------------
   HTML ELEMENTS
------------------------------------------------- */ 

/* Top Elements */
* { margin: 0; padding: 0; outline: 0 }

body {
	background: #d5ea8e url(/media/1062/bg.gif) repeat-x;
	font: 12px/170% 'Lucida Grande', 'Lucida Sans Unicode', Geneva, Verdana, sans-serif;
	color: #666666; 
	text-align: center;	
}

/* links */
a, a:visited {	
	color: #306495;
	background: inherit;
	text-decoration: none;
}
a:hover {
	color: #73471B;
	background: inherit;
	text-decoration: underline;
}

/* headers */
h1, h2, h3 {
	font-family: 'Trebuchet MS', 'Helvetica Neue', Arial, Sans-serif;
	font-weight: Bold; 	
	padding: 10px;		
	color: #444;	
}
h1 {
	font-size: 2.2em;		
}
h2 {
	font-size: 2em;
	color: #88ac0b;
}
h3 {
	font-size: 1.4em;
	font-weight: normal;	
	padding: 16px 10px 4px 10px;
}

/* Paragraph */
p { padding: 12px 10px;	}

/* Lists */
ul, ol {
	margin: 10px 20px;
	padding: 0 20px;	
}
ul { list-style: none; }

dl { padding: 10px; margin: 0; }

dt {
  font-weight: bold;
  color: #79A62E;
}
dd {
  padding-left: 25px; 
}

/* images */
img {
	background: #EDF8C7;
   border: 1px solid #EDF8C7;
	padding: 7px;
}
img.float-right {
  	margin: 5px 0px 10px 10px;  
}
img.float-left {
  	margin: 5px 10px 10px 0px;
}

code {
  	margin: 5px 0;
  	padding: 0px;
  	text-align: left;
  	display: block;
  	overflow: auto;  
  	font: 500 1em/1.5em 'Lucida Console', 'Courier New', monospace ;
  	/* white-space: pre; */
  	border: 1px solid #deedae; 
	background: #EDF8C7; 
}
acronym {
  cursor: help;
  border-bottom: 1px dotted #895F30;
}
blockquote {
	margin: 15px 10px;
 	padding: 5px 7px 5px 40px;  	
   font-weight: normal;
	font-size: 17px;
	line-height: 1.6em;
	font-style: italic;
	font-family: Georgia, 'Times New Roman', Times, serif;		
	color: #80614D;	
	border: 1px solid #DFF4B5; 
	background: #F0FFD2 url(/media/1072/quote.gif) no-repeat 7px 10px;
}

/* start - table */
table {
	border-collapse: collapse;
	margin: 15px 10px;		
}
th {
	height: 38px;
	padding-left: 12px;
	padding-right: 12px;
	color: #fff;
	text-align: left;
	background: #ADD163;	
	border-width: 1px;
  	border-style: solid;
  	border-color: #C4DE8F #93C138 #93C138 #C4DE8F;	
}
tr {
	height: 34px;
	background: #fff;
}
td {
	padding-left: 11px;
	padding-right: 11px;
	border: 1px solid #E7F0CC;	
}	
/* end - table */

/* form elements */
/*as shipped in template form {
	margin: 15px 10px; 
	padding: 5px 10px 20px 10px;
	border: 1px solid #D8E99E; 
	background: #deedae; 	
}*/
/* as hacked by ed*/
form {
	background:#EDF8C7 url(/media/1064/content.gif) repeat-y scroll 0 0;
	border:0 solid #D8E99E;
	margin:0;
	padding:5px 10px 20px;
}
label {
	display: block;
	font-weight: bold;
	margin: 8px 0 5px 0;
	color: #895F30;
}
input, textarea, select {
	padding: 4px;
	color: #666666;		
	background: #fff;
	
  	border-width: 1px;
  	border-style: solid;
  	border-color: #d4d4d4 #ebebeb #ebebeb #d4d4d4; 
	
	font: normal 11px Verdana, sans-serif;
}
textarea {
	width: 400px;	
	height: 100px;
	display: block;	
}
input.button { 
	font: bold 12px Arial, Sans-serif; 
	height: 30px;
	margin: 0;
	padding: 2px 3px; 
	color: #fff;
	background: #A6CD56;
	
	border-width: 1px;
  	border-style: solid;
  	border-color: #C4DE8F #8DB836 #8DB836 #C4DE8F;
}


/********************************************
   LAYOUT
********************************************/ 
#wrap {
	position: relative;
	width: 920px;
	background: #edf8c7 url(/media/1075/wrap.gif) repeat-y center top;
	margin: 35px auto;
	text-align: left;	
}
#content-wrap {
	position: relative;
	clear: both;
	float: left;	
	width: 920px;	
	padding: 25px 0; 	
	background: #edf8c7 url(/media/1064/content.gif) repeat-y;	
}
#header {
	position: relative;
	width: 920px;
	height: 205px;
	background: #317cb1 url(/media/1068/header.gif) no-repeat;	
	color: #fff;	
	padding: 0;	
	margin: 0;
}
#header h1#logo-text a {
	position: absolute;
	margin: 0; padding: 0;
	font: bold 56px 'Trebuchet MS', 'Helvetica Neue', Arial, Sans-serif;
	letter-spacing: -3px;
	text-decoration: none;
	color: #fff;
	
	/* change the values of top and left to adjust the position of the logo*/
	top: 58px; left: 55px;	
}
#header p#slogan {
	position: absolute;
	margin: 0; padding: 0;
	font: bold 15px 'Trebuchet MS', 'Helvetica Neue', Arial, Sans-serif;
	color: #D6EBAB;
	letter-spacing: -0.5px;
	
	/* change the values of top and left to adjust the position of the slogan*/
	top: 122px; left: 135px;		
}

/* header quick search */
#header form#quick-search {
	position: absolute;
	top: 75px; right: 55px;
	padding: 0; margin: 0;
	border: none;
	width: 223px; height: 33px;
	background: #82c7f4 url(/media/1069/header-search.gif) no-repeat;	
	z-index: 999999;
}
#header form#quick-search p {
	margin: 0; padding: 0;		
}
#header form#quick-search input {
	border: none;
	background: transparent;
	color: #0e5792;
	float: left;
}
#header form#quick-search .tbox {
	margin: 5px 0 0 5px; 
	width: 170px;	
	display: inline;	
}
#search form#quick-search .btn{
	width: 25px; height: 25px;		
}
#header form#quick-search label {
	display: none;
}

/* Navigation */
#nav {
	clear: both;	
	padding: 0;	margin: 0;
	width: 920px;
	height: 50px;
	background: #EDF8C7 url(/media/1070/nav.gif) no-repeat;		
}
#nav ul {
	float: left;
	list-style: none;	
	margin: 0;
	padding: 0 0 0 40px;			
	height: 50px;	
}
#nav ul li {
	display: inline;
	margin: 0; padding: 0;
}
#nav ul li a {
	display: block;
	float: left;
	width: 112px;
	margin: 0;
	padding: 0 84px;
	color: #fff;
	font: bold 15px/50px 'Trebuchet MS', 'Helvetica Neue', Arial, sans-serif;
	text-decoration: none;	
	letter-spacing: -0.5px;
}
#nav ul li a:hover, 
#nav ul li a:active {
	color: #edf8c7;	
}
#nav ul li.Selected a {	
	background: #0c4e80 url(/media/1071/pointer.gif) no-repeat center bottom;	
	color: #93DAFF;
}

/* Main Column */
#main {
	float: left;
	width: 795px;
	padding: 0; margin: 0 0 0 45px;
	display: inline;	
}
#main h2 {
	font: bold 2.25em 'Trebuchet MS', 'Helvetica Neue', Arial, Sans-serif;
	color: #115280; 
	padding: 10px 0 5px 5px; 	
	margin-left: 5px;		
	letter-spacing: -1px;
	border-bottom: 1px solid #D2E9A4;
}
#main h2 a {
	color: #115280;
	text-decoration: none;		
}
#main ul li {
	list-style-image: url(/media/1063/bullet.gif);
}

#sidebar {
	float: right;
	width: 1px;
	padding: 0; 
	margin: 0 45px 0 0;
	display: inline;	
}
#sidebar h3 {
	color: #115280; 
	font: normal 1.6em 'Trebuchet MS', 'Helvetica Neue', Arial, Sans-serif;
	text-transform: none;
	padding: 10px 0 2px 0; 
	margin: 10px 0 0 10px; 
}

/* sidebar menu */
#sidebar .sidemenu {
	margin: 5px 10px 8px 7px; padding: 0;
	text-decoration: none;		
	border-top: 2px solid #D0E89F;
}
#sidebar .sidemenu li {
	list-style: none;
	margin: 0;
	padding: 7px 10px; 			
	border-bottom: 1px solid #DAEBA3;	
}
* html body #sidebar .sidemenu li {
	height: 1%;
}
#sidebar .sidemenu li a {
	text-decoration: none;	
	color: #684F3E;	
}
#sidebar .sidemenu li a span {
	color: #A98D76;	
	font-size: .9em;
	
	font-family: Georgia, 'Times New Roman', Times, serif;
	font-style: italic;
	font-weight: normal;		
}
#sidebar .sidemenu li a:hover {	
	color: #000;	
	background: none;	
}
#sidebar .sidemenu ul { margin: 0 0 0 5px; padding: 0; }
#sidebar .sidemenu ul li { border: none; }

#sidebar #NewsList  {
	margin: 5px 10px 8px 7px; padding: 0;
	text-decoration: none;		
	border-top: 2px solid #D0E89F;
}
#sidebar #NewsList  li {
	list-style: none;
	margin: 0;
	padding: 7px 10px; 			
	border-bottom: 1px solid #DAEBA3;	
}
* html body #sidebar #NewsList  li {
	height: 1%;
}
#sidebar #NewsList  li a {
	text-decoration: none;	
	color: #684F3E;	
}
#sidebar #NewsList  li a span {
	color: #A98D76;	
	font-size: .9em;
	
	font-family: Georgia, 'Times New Roman', Times, serif;
	font-style: italic;
	font-weight: normal;		
}
#sidebar #NewsList  li a:hover {	
	color: #000;	
	background: none;	
}
#sidebar #NewsList  ul { margin: 0 0 0 5px; padding: 0; }
#sidebar #NewsList  ul li { border: none; }


/* search form */
#sidebar .searchform {
	background-color: transparent;
	border: none;	
	margin: 0 0 0 5px; 
	padding: 10px 0 10px 10px;	
	width: 260px;	
}
#sidebar .searchform p { margin: 0; padding: 0; }
#sidebar .searchform input.textbox { 
	width: 180px;
	height: 18px;
	padding: 2px;	
	vertical-align: top;
}
#sidebar .searchform input.button { 
	width: 60px;
	height: 24px;
	padding: 2px 4px;
	vertical-align: top;
}

/* footer */
#footer-wrap {
	clear: both;
	width: 950px;
	text-align: left;
	padding: 0;	margin: 0;
	background: url(/media/1066/footer-bottom.gif) no-repeat left bottom;		
}
#footer-content {
	width: 950px;
	background: url(/media/1067/footer-top-sep.gif) no-repeat;	
	padding: 30px 0 35px 0;
}

#footer-wrap p {
	padding:10px 0;
}
#footer-wrap h3 {
	color: #145F94; 
	margin: 0;
	padding: 5px 0 5px 10px; 
	text-transform: uppercase;
}
#footer-wrap a:hover { 
	color: #000; 
	text-decoration: none;
}

#footer-columns {
	color: #888;
	margin: 0 auto; 
	padding: 0;	
	width: 800px;		
}
#footer-columns ul {
	list-style: none;
	margin: 0; 
	padding: 0;	
	border-top: 1px solid #BFD286;
}
#footer-columns li {
	border-bottom: 1px solid #CCDA9E;		
}
#footer-columns li a {
	display: block;
	font-weight: normal;
	padding: 8px 0 8px 10px;
	width: 96%;
	color: #666666;	
}

#footer-columns .col3, .col3-center {
	float: left;
	width: 32%;
}
#footer-columns .col3-center { 
	margin: 0 15px; 
}

/* bottom */
#footer-bottom {
	clear: both;
	color: #555;	
	margin: 0 auto; 
	width: 920px;
	padding: 15px 0 10px 0;
	text-align: center;	
	font-size: 0.95em;
}
#footer-bottom a { color: #306495; }

/* postmeta */
.post-footer {
	padding: 8px 5px; 
	margin: 5px 10px 10px 10px;	
	color: #A2745D;
	border: 1px solid #deedae; 
	background: #F0FFD2;
}
.post-footer .date{ margin: 0 10px 0 5px;	}
.post-footer a.comments { margin: 0 10px 0 5px;	}
.post-footer a.readmore { margin: 0 10px 0 5px;	}

.post-info { font-size: .95em; padding: 0 10px; margin-left: 2px; color: #A98D76; }
.post-info a, .post-info a:visited { color: #9C652E; }

/* alignment classes */
.float-left  { float: left; }
.float-right { float: right; }
.align-left  { text-align: left; }
.align-right { text-align: right; }

/* clearing */
.clearer { clear: both; }
.clear {	display:inline-block; }
.clear:after {
	display:block; 
	visibility:hidden; 
	clear:both; 
	height:0; 
	content: "."; 
}

	</style>
</head>

	<body>
		<h1 align="center"><strong>Reprographics Request Form</strong></h1>
		<div id="contact-wrapper">

	<form method="post" action="<?php echo $_SERVER['PHP_SELF']; ?>" id="contactform" enctype="multipart/form-data" >
		<table width="900" height="300" border="0" align="center">
   			<tr>
    			<td width="900" height="40" colspan="4" scope="col">
                	<div align="center">
      					<p>
        					<input type="hidden" name="MAX_FILE_SIZE" value="100000" />
        					<strong>Choose a file to upload:</strong>
        					<input name="uploadedfile" type="file" />
      					</p>
                	</div>
   				</td>
    		</tr>
      		<tr>
    			<td colspan="2" scope="col">
                	<div style="width:400px">
	      			<div align="left"><strong>Name:</strong></div>
					<div align="left">
		  				<input type="text" size="50" name="name" id="name" value="" />
		  			</div>
    				</div>
                </td>
    			<td colspan="2" scope="col">    <div style="width:400px">
     				<div align="left"><strong>Department:</strong></div>
      				<div align="left">
        				<input type="text" size="50" name="dept" id="dept" value="" />
        			</div>
    				</div>
                </td>
  			</tr>
  			<tr>
    			<td colspan="2" scope="row">	
                	<div style="width:400px">
		  			<div align="left"><strong>Paper Colour:</strong></div>
					<div align="left">
		  				<input type="text" size="50" name="papercolour" id="papercolour" value="" />
		  			</div>
    				</div>
               	</td>
    			<td colspan="2">	
                	<div style="width:400px">
      				<div align="left"><strong>Date:<br /></strong>
        				<input type="text" size="50" name="Date" id="Date" value="" />
        			</div>
      				</div>
				</td>
 			</tr>
  			<tr>
    			<td colspan="2" scope="row">	
                	<div style="width:400px">
      				<div align="left"><strong>Quantity:</strong></div>
      				<div align="left">
        				<input type="text" size="50" name="quantity" id="quantity" value="" />
        			</div>
      				</div>
              	</td>
    			<td colspan="2">
      				<div style="width:400px">
        			<div align="left"><strong>Date Required:</strong></div>
        			<div align="left">
          				<input type="text" size="50" name="datereq" id="datereq" value="" />
          			</div>
        			</div>
               	</td>
  			</tr>
  			<tr>
    			<td width="222" scope="row">	
                	<div style="width:200px">
      				<div align="left"><strong>Size:</strong></div>
      				</div>
               	</td>
    			<td width="219" scope="row">
                	<select name="size" id="size">
      				<option value="A4">A4</option>
      				<option value="A3">A3</option>
      				<option value="A5">A5</option>
      				</select>
                </td>
    			<td width="222">
      				<div style="width:200px">
        			<div align="left"><strong>Hole Punched:</strong></div>
        			</div>
                </td>
    			<td width="219"><input name="hole" type="checkbox" id="hole" value="Yes" />
                </td>
  			</tr>
  			<tr>
    			<td scope="row">	
                	<div style="width:200px">
		  			<div align="left"><strong>Stapled:</strong></div>
    				</div>
               	</td>
    			<td scope="row"><input name="stapled" type="checkbox" id="stapled" value="Yes" />
                </td>
    			<td>
      				<div style="width:200px">
        			<div align="left"><strong>Folded:</strong></div>
      				</div>
                </td>
    			<td>
                	<input name="folded" type="checkbox" id="folded" value="Yes" />
                </td>
  			</tr>
		</table>
  		<table width="900" height="114" border="1" align="center">
    		<tr>
    			<th width="79" height="169" scope="col">Special Instructions:
                </th>
    			<th width="670" scope="col"><textarea name="special" cols="112" rows="10" id="C"></textarea>
                </th>
  			</tr>
		</table>
			<p align="center">
				<input type="submit" name="submit" value="Submit" />
			</p>
	</form>
		</div>
	</body>
</html>

:D Just need to do a fair bit of code tidy up now, it's safe to say getting started is the hardest part of making anything! once you have the start it's quite fun and easy
 
Last edited:
You must log in or register to reply here.
Back
Top Bottom