CodingForums.com - PHP Enquiry form

CodingForums.com (http://www.codingforums.com/index.php)

- PHP (http://www.codingforums.com/forumdisplay.php?f=6)

- - PHP Enquiry form (http://www.codingforums.com/showthread.php?t=286964)

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

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;

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>

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;

}

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>

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?

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.