Go Back   CodingForums.com > :: Server side development > PHP

Before you post, read our: Rules & Posting Guidelines

Reply
 
Thread Tools Rate Thread
Enjoy an ad free experience by logging in. Not a member yet? Register.
Old 02-03-2013, 03:08 PM   PM User | #1
mzpresto
New Coder

 
Join Date: Aug 2012
Posts: 45
Thanks: 15
Thanked 0 Times in 0 Posts
mzpresto is an unknown quantity at this point
PHP Enquiry form

Hi

I need some help, I can battle my way through CSS and HTML, but when it comes to enquiry forms I am out of my depth...

This is the site I am putting together and the form is in the end column:

http://vicarscafebistro.co.uk/website/contact.html

I tried using this form from here: http://css-tricks.com/nice-and-simple-contact-form/

But it was far too big and when I tried to make it smaller it was all over the place so currently has no CSS applied to it...

From a layout perspective how can I get the text input fields to stack nicely and all aligned?

From a PHP perspective what have I done to break it? I am testing it with my home email address but it is not working...

Here is my HTML for it:

Code:
<div id="page-wrap"> 

<div id="contact-area"> 

<form method="post" action="contactengine.php"> 

<p><label for="Name">Name:</label> 

<input type="text" name="Name" id="Name" /> </p>

<p><label for="City">City:</label> 

<input type="text" name="City" id="City" /> </p>

<p><label for="Phone">Email:</label> 

<input type="text" name="Phonr" id="Phone" /> </p>

<p><label for="Email">Phone:</label> 

<input type="text" name="Email" id="Email" /> </p>

<p>&nbsp;</p>

<p><label for="Message">Comments:</label><br /> 

<textarea name="Message" rows="5" cols="33" id="Message"></textarea> </p>

<p><input type="submit" name="submit" value="Submit" class="submit-button" /> 

</form></p> 

<div style="clear: both;"></div> 

</div> 
</div>
There is no CSS as I could not work out what to use, but what they suggested was:

Code:
* {
	margin: 0;
	padding: 0;
}

body {
	font-size: 62.5%;
	font-family: Helvetica, sans-serif;
	background: url(images/stripe.png) repeat;
}

p {
	font-size: 1.3em;
	margin-bottom: 15px;
}

#page-wrap {
	width: 660px;
	background: white;
	padding: 20px 50px 20px 50px;
	margin: 20px auto;
	min-height: 500px;
	height: auto !important;
	height: 500px;
}

#contact-area {
	width: 600px;
	margin-top: 25px;
}

#contact-area input, #contact-area textarea {
	padding: 5px;
	width: 471px;
	font-family: Helvetica, sans-serif;
	font-size: 1.4em;
	margin: 0px 0px 10px 0px;
	border: 2px solid #ccc;
}

#contact-area textarea {
	height: 90px;
}

#contact-area textarea:focus, #contact-area input:focus {
	border: 2px solid #900;
}

#contact-area input.submit-button {
	width: 100px;
	float: right;
}

label {
	float: left;
	text-align: right;
	margin-right: 15px;
	width: 100px;
	padding-top: 5px;
	font-size: 1.4em;
}
The PHP They supply is here:

Code:
<?php

$EmailFrom = "chriscoyier@gmail.com";
$EmailTo = "CHANGE-THIS@YOUR-DOMAIN.com";
$Subject = "Nice & Simple Contact Form by CSS-Tricks";
$Name = Trim(stripslashes($_POST['Name'])); 
$Tel = Trim(stripslashes($_POST['Tel'])); 
$Email = Trim(stripslashes($_POST['Email'])); 
$Message = Trim(stripslashes($_POST['Message'])); 

// validation
$validationOK=true;
if (!$validationOK) {
  print "<meta http-equiv=\"refresh\" content=\"0;URL=error.htm\">";
  exit;
}

// prepare email body text
$Body = "";
$Body .= "Name: ";
$Body .= $Name;
$Body .= "\n";
$Body .= "Tel: ";
$Body .= $Tel;
$Body .= "\n";
$Body .= "Email: ";
$Body .= $Email;
$Body .= "\n";
$Body .= "Message: ";
$Body .= $Message;
$Body .= "\n";

// send email 
$success = mail($EmailTo, $Subject, $Body, "From: <$EmailFrom>");

// redirect to success page 
if ($success){
  print "<meta http-equiv=\"refresh\" content=\"0;URL=contactthanks.php\">";
}
else{
  print "<meta http-equiv=\"refresh\" content=\"0;URL=error.htm\">";
}
?>
Which I changed to this (I was guessing and it doesn't work)

Code:
<?php

$EmailFrom = "heypresto@blueyonder.co.uk";
$EmailTo = "heypresto@blueyonder.co.uk";
$Subject = "Nice & Simple Contact Form by CSS-Tricks";
$Name = Trim(stripslashes($_POST['Name'])); 
$City = Trim(stripslashes($_POST['City'])); 
$Phone = Trim(stripslashes($_POST['Phone'])); 
$Email = Trim(stripslashes($_POST['Email'])); 
$Message = Trim(stripslashes($_POST['Message'])); 

// validation
$validationOK=true;
if (!$validationOK) {
  print "<meta http-equiv=\"refresh\" content=\"0;URL=error.htm\">";
  exit;
}

// prepare email body text
$Body = "";
$Body .= "Name: ";
$Body .= $Name;
$Body .= "\n";
$Body .= "City: ";
$Body .= $City;
$Body .= "\n";
$Body .= "Phone: ";
$Body .= $Phone;
$Body .= "\n";
$Body .= "Email: ";
$Body .= $Email;
$Body .= "\n";
$Body .= "Comments: ";
$Body .= $Comments;
$Body .= "\n";

// send email 
$success = mail($EmailTo, $Subject, $Body, "From: <$EmailFrom>");

// redirect to success page 
if ($success){
  print "<meta http-equiv=\"refresh\" content=\"0;URL=contactthanks.php\">";
}
else{
  print "<meta http-equiv=\"refresh\" content=\"0;URL=error.htm\">";
}
?>
Any help would be much appreciated.... Thanks
mzpresto is offline   Reply With Quote
Old 02-03-2013, 05:30 PM   PM User | #2
sunfighter
Senior Coder

 
Join Date: Jan 2011
Location: Missouri
Posts: 2,383
Thanks: 18
Thanked 350 Times in 349 Posts
sunfighter is on a distinguished road
Style for the form:
Code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<style type="text/css">
#page-wrap{
	width:200px;
}
label{
	float:left;
	margin-bottom: 5px;
}
input{
	float:right;
	margin-bottom: 5px;
}
</style>
</head>
<body>
<div class="text">
<p><img src="http://vicarscafebistro.co.uk/website/Enquiry.jpg" width="155" height="37" /></p>
<div id="page-wrap">
	<div id="contact-area">
		<form method="post" action="contactengine.php">
			<label for="Name">Name:</label>
			<input type="text" name="Name" id="Name" />

			<label for="City">City:</label>
			<input type="text" name="City" id="City" />

			<label for="Phone">Email:</label>
			<input type="text" name="Phone" id="Phone" />

			<label for="Email">Phone:</label>
			<input type="text" name="Email" id="Email" />
			<p>&nbsp;</p>
			<p><label for="Message">Comments:</label><br />
			<textarea name="Message" rows="5" cols="33" id="Message" ></textarea> </p>
			<p><input type="submit" name="submit" value="Submit" class="submit-button" style="float:left;" />
		</form></p>
		<div style="clear: both;"></div>
	</div>
</div>
<!-- end .text --></div>
</body>
</html>
Notice This line
Code:
<input type="text" name="Phonr" id="Phone" />
Changed to this
Code:
<input type="text" name="Phone" id="Phone" />
The r for e mistype was part of the php failure.
The second error is here, in the php file:
Code:
$Body .= "Comments: ";
$Body .= $Comments;
S/B:
Code:
$Body .= "Comments: ";
$Body .= $Message;

Last edited by sunfighter; 02-03-2013 at 05:44 PM..
sunfighter is offline   Reply With Quote
Old 02-03-2013, 06:50 PM   PM User | #3
mzpresto
New Coder

 
Join Date: Aug 2012
Posts: 45
Thanks: 15
Thanked 0 Times in 0 Posts
mzpresto is an unknown quantity at this point
Hi

Thanks so much for the quick response, I fixed the errors with the div tag and php and re-uploaded, I get the other script saying message succesful, but the email is not coming through to my inbox I checked the webhost and it does support PHP so I really don't know why it's still not working. I am getting other emails to my inbox so it's not that.

I also tried the CSS for the layout and it is VERY close, but for some reason it stacks name and city together and I have an extra box for comments and I can't for the life of me figure out why???

See here:

http://vicarscafebistro.co.uk/website/contact.html

PHP now reads as follows:

Code:
<?php

$EmailFrom = "heypresto@blueyonder.co.uk";
$EmailTo = "heypresto@blueyonder.co.uk";
$Subject = "Nice & Simple Contact Form by CSS-Tricks";
$Name = Trim(stripslashes($_POST['Name'])); 
$City = Trim(stripslashes($_POST['City'])); 
$Phone = Trim(stripslashes($_POST['Phone'])); 
$Email = Trim(stripslashes($_POST['Email'])); 
$Message = Trim(stripslashes($_POST['Message'])); 

// validation
$validationOK=true;
if (!$validationOK) {
  print "<meta http-equiv=\"refresh\" content=\"0;URL=error.htm\">";
  exit;
}

// prepare email body text
$Body = "";
$Body .= "Name: ";
$Body .= $Name;
$Body .= "\n";
$Body .= "City: ";
$Body .= $City;
$Body .= "\n";
$Body .= "Phone: ";
$Body .= $Phone;
$Body .= "\n";
$Body .= "Email: ";
$Body .= $Email;
$Body .= "\n";
$Body .= "Comments: ";
$Body .= $message;
$Body .= "\n";

// send email 
$success = mail($EmailTo, $Subject, $Body, "From: <$EmailFrom>");

// redirect to success page 
if ($success){
  print "<meta http-equiv=\"refresh\" content=\"0;URL=contactthanks.php\">";
}
else{
  print "<meta http-equiv=\"refresh\" content=\"0;URL=error.htm\">";
}
?>

CSS added:

Code:
}
#page-wrap {
	width:290px;
}	
label {
	float:left;
	margin-bottom: 5px;
}
input {
	float:right;
	margin-bottom: 5px;
}
and the html...

Code:
<div id="page-wrap"> 
 
	 
				
		<div id="contact-area"> 
			
			<form method="post" action="contactengine.php"> 
            
				<label for="Name">Name:</label> 
				<input type="text" name="Name" id="Name" />
                
                <label for="City">City:</label> 
				<input type="text" name="City" id="City" />
			
				<label for="Phone">Phone:</label> 
				<input type="text" name="Phone" id="Phone" />
                
				<label for="Email">Email:</label> 
				<input type="text" name="Email" id="Email" />
				
				<label for="Message">Comments:</label>
				<textarea name="Message" rows="5" cols="33" id="Message"></textarea>
 
			<input type="submit" name="submit" value="Submit" class="submit-button" /> 
			</form> 
			
			<div style="clear: both;"></div> 
			
 
		
		</div> 
	
	</div>

Last edited by mzpresto; 02-03-2013 at 06:55 PM.. Reason: add php
mzpresto is offline   Reply With Quote
Old 02-03-2013, 08:01 PM   PM User | #4
elem
New Coder

 
Join Date: Sep 2011
Posts: 35
Thanks: 18
Thanked 1 Time in 1 Post
elem is an unknown quantity at this point
try that CSS (that 100px width is just a rough guess, you may want to change it slightly if it's too long)
Code:
label {
	text-align:right;
	width: 100px;
	margin-bottom: 5px;
}
input {
	margin-bottom: 5px;
}
elem is offline   Reply With Quote
Old 02-03-2013, 08:47 PM   PM User | #5
sunfighter
Senior Coder

 
Join Date: Jan 2011
Location: Missouri
Posts: 2,383
Thanks: 18
Thanked 350 Times in 349 Posts
sunfighter is on a distinguished road
Quote:
but for some reason it stacks name and city together
You never inserted the css styling anywhere:

Code:
<style type="text/css">
#page-wrap{
	width:200px;
}
label{
	float:left;
	margin-bottom: 5px;
}
input{
	float:right;
	margin-bottom: 5px;
}
</style>
sunfighter is offline   Reply With Quote
Old 02-03-2013, 08:56 PM   PM User | #6
mzpresto
New Coder

 
Join Date: Aug 2012
Posts: 45
Thanks: 15
Thanked 0 Times in 0 Posts
mzpresto is an unknown quantity at this point
Thanks guys! Haha still couldn't work out the layout in CSS with that last form, even with the width thing added and trying diff properties so tried another one in a table with a diff php, still no message so must be something to do with the hosting company?
mzpresto is offline   Reply With Quote
Old 02-03-2013, 09:06 PM   PM User | #7
mzpresto
New Coder

 
Join Date: Aug 2012
Posts: 45
Thanks: 15
Thanked 0 Times in 0 Posts
mzpresto is an unknown quantity at this point
Figured it out, it was getting rejected as spam because the email "from" was not the same as the hosting domain, I have not set that part up yet so unable to test, but makes sense, found this:

Setting the ‘From’ field right

Have a ‘From’ field in the emails that you sent through the script. The From address should belong to the domain from where you are running the script. If your script is running on your-website.com then the From address should be like someone@your-website.com.
mzpresto is offline   Reply With Quote
Reply

Bookmarks

Jump To Top of Thread


Thread Tools
Rate This Thread
Rate This Thread:

Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts

BB code is On
Smilies are On
[IMG] code is On
HTML code is Off

Forum Jump


All times are GMT +1. The time now is 10:32 PM.


Advertisement
Log in to turn off these ads.