Help Cleaning HTML Mislabeling

Downloaded a great contact form with location map (can't remember where from), however when I try to validate the page I'm getting back a lot of errors and need help cleaning them up if anyone would be so kind.

Many of the errors I have cleaned up, and the rest MIGHT be minor, however I didn't want to take a chance with breaking anything without asking people more knowledgeable than myself.

The majority of the errors are "The for attribute of the label element must refer to a form control."

The form, as it stands currently, has the for attributes as follows...
[located on http://www.rutholsonphoto.com/contact.php]


<form id="contact" method="post" action="">
<fieldset>

<label for="name">Name</label>
<input type="text" name="name" placeholder="Full Name" title="Enter your name" class="required">

<label for="email">E-mail</label>
<input type="email" name="email" placeholder="yourname@domain.com" title="Enter your e-mail address" class="required email">

<label for="phone">Phone</label>
<input type="tel" name="phone" placeholder="ex. (555) 555-5555">

<label for="website">Website</label>
<input type="url" name="url" placeholder="http://">

<label for="message">Question/Comment</label>
<textarea name="message"></textarea>

<input type="submit" name="submit" class="button" id="submit" value="Send Message" />

</fieldset>
</form>


Now I COULD possibly go in and change these to more HTMl correct names, but I want to make sure it's not going to interfere with our processing code which is...


<?php
// Get Data
$name = strip_tags($_POST['name']);
$email = strip_tags($_POST['email']);
$phone = strip_tags($_POST['phone']);
$url = strip_tags($_POST['url']);
$message = strip_tags($_POST['message']);

// who is getting this email ...
$to="email@email.com";

// subject
$subject="Website Mail";

$msg = "
Website Mail
---------------------------------------------------
Name: $name
Phone: $phone
Email: $email
URL: $url
---------------------------------------------------
$message
---------------------------------------------------
";

$extraheaders = "From: $email\r\nReply-To: $email\r\n";

if (! mail($to, $subject, $msg, $extraheaders))
echo "Mail did not send for some reason.";

// where to go after the email is sent ...
header("Location: ./index.php");

?>


Do you guys think the processing form is using the *or or the *name attribute for it's feeding values???

The for attribute value should match the id of the associated input element. You should be able to sort you errors by adding appropriate and matching ids.

The for attribute value should match the id of the associated input element. You should be able to sort you errors by adding appropriate and matching ids.

Could you clarify this by displaying some sample code?

What I got from this is for me to add an id tag in each *label element that displays the same *name as the *for element and this should solve the problem, however that isn't the case. Which means that I either did something wrong, or misunderstood what you were suggesting I do.

SB65 is correct that adding an ID to each input element (not the label elements, as you appear to have done) that matches the respective label's "for" attribute will fix the validation of those "for" attribute errors.

If you like, you can instead skip the "for" attribute by placing the input elements inside of the label element itself.

That is called "implicit" labeling. It is not as fool-proof as explicit labeling, but it's there if you want to drop the "for" attributes.

Anyway, move those ID's you added over to the input elements and you should be set for fixing this error.

SB65 is correct that adding an ID to each input element (not the label elements, as you appear to have done) that matches the respective label's "for" attribute will fix the validation of those "for" attribute errors.

If you like, you can instead skip the "for" attribute by placing the input elements inside of the label element itself.

That is called "implicit" labeling. It is not as fool-proof as explicit labeling, but it's there if you want to drop the "for" attributes.

Anyway, move those ID's you added over to the input elements and you should be set for fixing this error.

Thanks for that.

Any idea about these? Been looking, but can't find an exact solution.