View Full Version : How can I add multiple comment boxes on a webpage? html/php

02-12-2012, 05:02 AM
Hey guys. I got my contact form to work, but now I ran into a different issue.

For people purchasing something on my website, I'm having them directed to a page where they can input information in comment boxes, and when they hit submit, the information is sent to my e-mail address.

I'm using HTML for the page itself, but it's working with PHP to make the e-mail go through to my e-mail.

The problem i'm having is - I have 4 comment boxes on the page I made, and everything works on the page. I even get the e-mail sent to me with the information that the person has entered, but I don't get ALL the information they entered. I'm only getting the information they entered in the first comment box.

Please follow me through this:::

There is 4 boxes. To test the page, I've entered in "aaa" in box 1, "bbb" in box 2, "ccc" in box 3, and "ddd" in box 4.

When I get the e-mail saying someone has entered their information on the page, the e-mail shows this:

*Name: John Doe
*phone: 5555555555
*Email: fake@email.com
Comment: aa
Comment1: aa
Comment2: aa
Comment3: aa

instead of showing each of the comment boxes being unique. I must be doing something wrong with the code.

When I created this new 'project info' page, I basically copied the boxes from the contact page I had, and then edited the code to make them work. This is the only thing that isn't working. What makes these comment boxes unique?

Here is my code for the comment boxes in the HTML:

<p style="left: 0px; top: -58px"><span lang="EN">
<strong>Tell us a bit about your business and your
&nbsp;<textarea class="text-area" name="contact-comment1" id="message" cols="20" rows="1"></textarea>&nbsp;
<span class="comment-required"></span></p>


<p style="left: 1px; top: -64px"><span lang="EN">
<strong>Tell us a bit about the demographics you target(type of customers, average age, male or female?, etc).
<textarea class="text-area1" name="contact-comment2" id="message0" cols="20" rows="1"></textarea>&nbsp;
<span class="comment2-required"></span></p>


<p style="left: 1px; top: -64px"><span lang="EN">
<strong>Please provide us with a list of your 5 favorite websites in terms of styling. In other words, which 5 websites do you feel have the best styling/presentation?
<textarea class="text-area2" name="contact-comment3" id="message1" cols="20" rows="1"></textarea>&nbsp;
<span class="comment3-required"></span></p>


<p style="left: 1px; top: -64px"><span lang="EN">
<strong>If you have any other comments or ideas, please communicate them here.
<textarea class="text-area3" name="contact-comment4" id="message2" cols="20" rows="1"></textarea>&nbsp;
<span class="comment4-required"><br><br></span></p>

<p class="under-shadow" style="left: 167.5px; top: -78px; width: 97px;">
<input class="send" id="submit-form" name="submit1" type="submit" value="Send" style="width: 93px" /></p>

<div class="clear"></div>
<p style="left: 4px; top: -500px">&nbsp;<p style="left: 4px; top: -450px">
&nbsp;<p style="left: 4px; top: -400px">&nbsp;


<div class="clear">

</div><!-- Grid 12 end -->

And here is my PHP page:

$names = $_POST['names'];
$phone = $_POST['phone'];
$email = $_POST['email_address'];
$comment = $_POST['comment'];
$comment1 = $_POST['comment1'];
$comment2 = $_POST['comment2'];
$comment3 = $_POST['comment3'];
$to ='fake@e-mail.com';

$message = "";
$message .= "*Name: " . htmlspecialchars($names, ENT_QUOTES) . "<br>\n";
$message .= "*phone: " . htmlspecialchars($phone, ENT_QUOTES) . "<br>\n";
$message .= "*Email: " . htmlspecialchars($email, ENT_QUOTES) . "<br>\n";
$message .= "Comment: " . htmlspecialchars($comment, ENT_QUOTES) . "<br>\n";
$message .= "Comment1: " . htmlspecialchars($comment, ENT_QUOTES) . "<br>\n";
$message .= "Comment2: " . htmlspecialchars($comment, ENT_QUOTES) . "<br>\n";
$message .= "Comment3: " . htmlspecialchars($comment, ENT_QUOTES) . "<br>\n";
$lowmsg = strtolower($message);

$headers = "MIME-Version: 1.0\r\nContent-type: text/html; charset=iso-8859-1\r\n";
$headers .= "From: \"" . $names . "\" <" . $email . ">\r\n";
$headers .= "Reply-To: " . $email . "\r\n";
$message = utf8_decode($message); mail($to, "PURCHASE ORDER", $message, $headers);

if ($message){
echo 'sent';
echo 'failed';

There is also this JS involved :

<!-- JS Start //-->
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js"></script>
<script>window.jQuery || document.write("<script src='js/libs/jquery-1.6.2.min.js'>\x3C/script>")</script>
<script type="text/javascript">
var $ = jQuery.noConflict();
<script type="text/javascript" src="js/jquery.detectbrowser.js"></script>
<script type="text/javascript" src="js/jquery.colorbox-min.js"></script>
<script type="text/javascript" src="js/jquery.easing.1.3.js"></script>
<script type="text/javascript" src="js/jquery.infieldlabel.min.js"></script>
<script type="text/javascript" src="js/jquery.twitter.js"></script>
<script type="text/javascript" src="js/jquery.supersubs.js"></script>
<script type="text/javascript" src="js/jquery.superfish.js"></script>
<script type="text/javascript" src="js/jquery.quovolver.js"></script>
<script type="text/javascript" src="js/jquery.tipTip.minified.js"></script>
<script type="text/javascript" src="js/jquery.totop.js"></script>
<script type="text/javascript" src="http://apis.google.com/js/plusone.js"></script>
<script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false"></script>
<script type="text/javascript" src="js/redirection_mobile.min.js"></script>

<!-- Custom Functions - Main Js file -->
<script type="text/javascript" src="js/functions.js"></script>

<!-- Redirect if mobile device -->
<script type="text/javascript">
SA.redirection_mobile ({
mobile_url : "hogash.com/ammon_html/iphone/", // put here your own link
mobile_prefix : "http",
cookie_hours : "2"

$(document).ready(function() {

// load hidden map

//process the contact form
var reg = /^([A-Za-z0-9_\-\.])+\@([A-Za-z0-9_\-\.])+\.([A-Za-z]{2,4})$/;
var names = $('#contact-form [name="contact-names"]').val();
var phone = $('#contact-form [name="contact-phone"]').val();
var email_address = $('#contact-form [name="contact-email"]').val();
var comment = $.trim($('#contact-form #message').val());
var comment1 = $.trim($('#contact-form #message0').val());
var comment2 = $.trim($('#contact-form #message1').val());
var comment3 = $.trim($('#contact-form #message2').val());
var data_html ='' ;

if(names == ""){
$('.name-required').html('Please enter your name.');
if(names == ""){
$('.phone-required').html('Please enter your phone.');
if(email_address == ""){
$('.email-required').html('Your email is required.');
}else if(reg.test(email_address) == false){
$('.email-required').html('Invalid Email Address.');

if(comment == ""){
$('.comment-required').html('Comment is required.');

if(comment != "" && names != "" && reg.test(email_address) != false) {
data_html = "names="+ names + "&phone="+ phone + "&comment=" + comment + "&email_address="+ email_address;
type: 'POST',
url: 'php-includes/contact_send3.php',
data: data_html,
success: function(msg){
if (msg == 'sent'){
$('#success').html('<div class="success">Message sent!</div>') ;
$('#contact-form [name="contact-names"]').val('');
$('#contact-form [name="contact-phone"]').val('');
$('#contact-form [name="contact-email"]').val('');
$('#contact-form #message').val('');
$('#contact-form #message0').val('');
$('#contact-form #message1').val('');
$('#contact-form #message2').val('');
$('#success').html('<div class="error">Mail Error. Please Try Again!</div>') ;

return false;

<!-- JS End //-->

I'm sorry this is so long. I hope someone knows what I'm trying to figure out here and is able to help.

Thanks a ton though in advance.


02-12-2012, 03:55 PM
I know nothing about jquery. It looks like it is just verifying user input to your form and not actually submitting the form. If true your submitting through the form and then you have an error

$comment = $_POST['comment'];
$comment1 = $_POST['comment1'];
$comment2 = $_POST['comment2'];
$comment3 = $_POST['comment3'];


$comment = $_POST['contact-comment1'];
$comment1 = $_POST['contact-comment2'];
$comment2 = $_POST['contact-comment3'];
$comment3 = $_POST['contact-comment4'];

Not Tested. If it don't work 'He did it not me':p

02-12-2012, 06:41 PM
k. I tried what you said, but it didn't work. The result of doing it, is when I got the email, all of the comments inputs were blank like this:

*Name: John Doe
*phone: 5555555555
*Email: fake@email.com

02-12-2012, 08:43 PM
Basically my question comes down to -

How do you add more than one comment box on a contact form?

Does anyone know a tutorial for this? or anything? I feel like I'm just missing a line of code somewhere or something isn't labeled right