Help!

@GemmaUKAug 19.2004

I’m creating a form at ~~[url]~~http://www.spookybetty.com/order.html[/url] and have encountered some problems along the way. After a lot of fiddling about, I’m now using ~~[url]~~http://www.thesitewizard.com[/url] to help me out with the php element, as I know bugger all about php. Its during the html where I’ve become stuck though.

I think I’ve got an error in the code, but I can’t figure out how to fix it. I’ve got boxes for people to enter information in (i.e “name”, “address” etc) and then I’ve got a drop-down menu where people can select the right size. However, although the drop down menu is towards the end of the code, its showing up at the very top of the page. How do I stop it from doing this? Also, radio buttons come up at the very top of the page too!

This is what I’ve written –

<table border=”0″ cellpadding=”8″ cellspacing=”8″ summary=”feedback form”>
<tr><td>Name:</td><td><input type=”text” name=”Name” size=”25″ /></td></tr>
<tr><td>Address:</td><td><input type=”text” name=”Address” size=”35″ /></td></tr>
<br>
<tr><td>Boot Name(s):</td><td><input type=”text” name=”Boot Name” size=”15″ /></td></tr>
<tr><td>Material(s):</td><td><input type=”text” name=”Material” size=”35″ /></td></tr>
<tr><td>Colour(s):</td><td><input type=”text” name=”Colour” size=”15″ /></td></tr>
<tr><td>Email address:</td><td><input type=”text” name=”email” size=”25″ /></td></tr><br>
<tr>
<td colspan=”2″>
Additional Information<br />
<textarea rows=”10″ cols=”45″ name=”Additional Information”>
</textarea>
</td>
</tr>
<br>
Size <SELECT Size=”Size” SIZE=”1″>
<OPTION SELECTED>3
<OPTION>4
<OPTION>5
<OPTION>6
<OPTION>7
<OPTION>8
<OPTION>9
<OPTION>10
<OPTION>11
<OPTION>12
<OPTION>13
</SELECT>
<br>
<h4>Please select your payment method.</h4>
<INPUT TYPE=”radio” NAME=”PayPal” VALUE=”Paypal”>Paypal<br>
<INPUT TYPE=”radio” NAME=”Cheque” VALUE=”Cheque”>Cheque<br>
<INPUT TYPE=”radio” NAME=”Money Order” VALUE=”Money Order”>Money Order<br>
<INPUT TYPE=”radio” NAME=”Other” VALUE=”Other”>Other<br>
Gender<SELECT Size=”Size” SIZE=”1″>
<OPTION SELECTED>Female
<OPTION>Male
</SELECT>(This is needed so the boot is cut to the correct shape.)
<tr>
<td align=”center” colspan=”2″>
<input type=”submit” value=”Submit” /><br />

Can somebody help me? Thank you! ?

to post a comment

HTML

12 Comments(s) _↴

@FangAug 19.2004 — #Your table is not complete. The drop-down is not in the table.

@GemmaUKauthorAug 19.2004 — #I put a <tr><td> in front of the select part. Now it isn't at the top of the page, but its at the bottom! How do I get it in the right place?

What a nerd, replying to my own post :rolleyes:

@GemmaUKauthorAug 19.2004 — #Ah I see, thank you! How do I put it into the table? Hmm.

@CharlesAug 19.2004 — #1) You're not supposed to use TABLES for layout.

2) It is important to associate explicitly form controls with their labels.

3) It is important to group form controls into fieldsets.

4) You ought not to mix up HTML and XHTML.

@CharlesAug 19.2004 — #[font=monospace]<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"

"http://www.w3.org/TR/html4/strict.dtd">

<html lang="en">

<head>

<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">

<meta name="Content-Style-Type" content="text/css">

<title>Example</title>

<style type="text/css">



</style>

</head>

<body>

<form action="someScript.pl">

<fieldset>

<legend>Who you are</legend>

<label>Name: <input type="text" name="Name"></label>

<label>Address: <input type="text" name="Address"></label>

<label>Email address: <input type="text" name="email"></label>

</fieldset>

<fieldset>

<legend>The boot</legend>

<label>Boot Name(s): <input type="text" name="Boot Name"></label>

<label>Material(s): <input type="text" name="Material"></label>

<label>Colour(s): <input type="text" name="Colour"></label>

<label>Additional Information <textarea rows="10" cols="45" name="Additional Information">

</textarea></label>

<label>Size <select size="Size">

<option selected>3</option>

<option>4</option>

<option>5</option>

<option>6</option>

<option>7</option>

<option>8</option>

<option>9</option>

<option>10</option>

<option>11</option>

<option>12</option>

<option>13</option>

</select></label>

<label>Gender<select size="">

<option selected>Female</option>

<option>Male</option>

</select></label>

</fieldset>

<fieldset id="payment">

<legend>Please select your payment method.</legend>

<div>

<label><input type="radio" name="PayPal" value="Paypal">Paypal</label> <label><input type="radio" name="Cheque" value="Cheque">Cheque</label> <label><input type="radio" name="Money Order" value="Money Order">Money Order</label> <label><input type="radio" name="Other" value="Other">Other</label>

</div>

</fieldset>

<div>

<button type="submit">Submit</button>

</div>

</form>

</body>

</html>[/font]

@GemmaUKauthorAug 20.2004 — #Wow, thats very impressive looking! Thanks very much for that.

The only problem is, I was using that table form because thats how I adapted it from the website I got the PHP form from. Basically, I know *nothing* about PHP, and need for people to be able to fill in that form, and for me to recieve the information in my email account. I was told I needed PHP for this, and managed to find a site that produced two codes, one was a form and the other is a PHP file. I don't think I can use the form you've provided me with, because I don't know how to alter the PHP file to work with it. I downloaded a php code, altered the appropriate areas (email address, the url you go onto after you've pressed "submit" - the thankyou.html url, and the error url.) and then uploaded it as feedback.php

The following is that php file -

PHP E-mail Receive Form Electronic Content Text

// Configuration Settings

$SendFrom = "Form Feedback <[email protected]>";

$SendTo = "[email protected]";

$SubjectLine = "Boot Order";

$ThanksURL = "thankyou.html"; //confirmation page

$Divider = "~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~";

// Build Message Body from Web Form Input

$MsgBody = @gethostbyaddr($REMOTE_ADDR) . "n$Dividern";

foreach ($_POST as $Field=>$Value)

$MsgBody .= "$Field: $Valuen";

$MsgBody .= $Divider . "n" . $HTTP_USER_AGENT . "n";

$MsgBody = htmlspecialchars($MsgBody); //make content safe

// Send E-Mail and Direct Browser to Confirmation Page

mail($SendTo, $SubjectLine, $MsgBody, "From: " . $SendFrom);

header("Location: $ThanksURL");

?>

Is it possible to alter this to work with your form? I assume I would have to change that php file and also the form you've provided me with, as the crappy html table form I did, had to involve areas relating to the php file.

Basically, I just need to be able to have the contents of the form emailed to me.

Also, I have a few more fields added now (see Http://www.spookybetty.com/order.html), how do I add these to your form?

Sorry about all the detailed questions, only your form is so much more professional looking.

Many thanks.

@CharlesAug 20.2004 — #It should work just fine with your script.

That's just a rough version to get you started. You are going to want to keep working on that. Remember, [url=http://www.w3.org/TR/html4/HTML]HTML[/url] is for content and [url=http://www.w3.org/TR/REC-CSS2/]CSS[/url] is for layout and presentation. And when you are done, make sure that you page passes the validators: http://validator.w3.org/ and http://jigsaw.w3.org/css-validator/.

@GemmaUKauthorAug 20.2004 — #Thank you. Frustratingly though, its not working with the php script. In my old script, I had <form action="feedback.php" method="post"> and towards the bottom, <input type="submit" value="Submit" /><br /> Don't I need these still, so the feedback.php works?

I've put your form up at http://www.spookybetty.com/Shop.html and the old form is located at http://www.spookybetty.com/order.html Could you tell me what I should do to your form, so it works with the feedback php file?

Many thanks!

?

@CharlesAug 20.2004 — #Not knowing PHP, I'm not sure exactly what's going on. But a couple of observations:

1) There is a PHP forum and the folks over there can help you with the PHP side.

2) [font=monospace]<button type="submit">Submit</button>[/font] and [font=monospace]<input type="submit" value="Submit">[/font] are the same as far as the FORM submission is concerned. I use BUTTON because it makes the CSS a little bit easier.

3) Those trailing slashes, [font=monospace]<br />[/font], are a part of XHTML™ and have no place in HTML. Do not use them.

@steelersfan88Aug 20.2004 — #Assuming your PHP script:

[code=php]<?php
 
 // Configuration Settings
 $SendFrom = "Form Feedback <[email protected]>";
 $SendTo = "[email protected]";
 $SubjectLine = "Boot Order";
 $ThanksURL = "thankyou.html"; //confirmation page
 $Divider = "~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~";
 
 // Build Message Body from Web Form Input
 $MsgBody = @gethostbyaddr($REMOTE_ADDR) . "n$Dividern";
 foreach ($_POST as $Field=>$Value)
 $MsgBody .= "$Field: $Valuen";
 
 $MsgBody .= $Divider . "n" . $HTTP_USER_AGENT . "n";
 $MsgBody = htmlspecialchars($MsgBody); //make content safe
 
 // Send E-Mail and Direct Browser to Confirmation Page
 mail($SendTo, $SubjectLine, $MsgBody, "From: " . $SendFrom);
 header("Location: $ThanksURL");
 
 ?>[/code]

works correctly, the only change that you'd need to make to Charles' script is add [font=monospace]method=post[/font] to the form tag.

And btw ... my opinions for using the button tag rather than input tag for a button ... easier on validation when grabbing all the input fields.

Dr. Script

@GemmaUKauthorAug 20.2004 — #Thanks very much. I entered <form action="feedback.php" method="post"> and now its all working fine.

Thank you both for your help. Its rather difficult when you have to do this sort of thing, when you know nothing about it.

@steelersfan88Aug 20.2004 — #Glad to pick Charles up ? and glad to help out ?

Also in #HTML _↴

Problems with Superscript within an ANCHOR How do you Modify a Code?html/javascript - how do you tsfr data from a form to and email

Success!

Help @GemmaUK spread the word by sharing this article on Twitter...

Tweet This

Help!

12 Comments(s) _↴

Also in #HTML _↴

Success!

Social

Version

Help!

12 Comments(s) ↴

Also in #HTML ↴

Success!

The web is an endless sea of information. Don't miss the boat... Subscribe!

Social

Version

12 Comments(s) _↴

Also in #HTML _↴