please help with wai validation on section of code.....

[geronimo171]

Hi,

I am going through a site validating it all but there are two form sections that won't validate and i can't figure it out....can anyone help?

the failure is:
12.4 Associate labels explicitly with their controls.

<div id="newsletter">
<h2 class="heading"><img src="../images/heading-keep-informed.gif" alt="Keep Informed" /></h2>
<form action="../mail_response.php" method="post" id="form1" >
<div>
<label>Register for email updates...</label>
<!--<input name="name" type="text" class="field" value="Name" onfocus="this.value=''" />-->
<input name="textfield" id="textfield" type="text" class="field" value="email@myemail.com" onfocus="this.value=''" />
<input type="submit" value="Register now!" class="submit" />
</div>
</form>
</div><!-- /newsletter -->

...and

<div id="search">
<h2 class="heading"><img src="images/heading-search.jpg" alt="Search" /></h2>
<form action="./search.php" method="get">
<div>
<label for="sdate">Date</label>
<select name="sdate" id="sdate" onchange="location.href='/search.php?sdate='+this.value">
<option class="action" selected="selected">Please select...</option>
<option value="2007-06">June</option>
<option value="2007-07">July</option>
<option value="2007-08">August</option>
<option value="2007-09">September</option>
</select>
<label for="sdate">Location</label>
<select name="slocation" id="slocation"  onchange="location.href='/search.php?slocation='+this.value">
<option class="action" selected="selected">Please select...</option>
<option value="1">Bradford</option>
<option value="3">Bingley</option>
<option value="2">Keighley</option>
<option value="4">Ilkley</option>                     
<option value="6">Saltaire/Shipley</option>
</select>
<label for="sevent">Event type</label>
<select name="sevent" id="sevent" onchange="location.href='/search.php?sevent='+this.value">
<option class="action" selected="selected">Please select...</option>
<option value="1">Music</option>
<option value="3">Arts</option>
<option value="5">Activity</option>
<option value="2">Film</option>
<option value="4">Festivals</option>
</select>
</div>
</form>
</div>

[GonzaloGM]

I think it's because of this:

<label>Register for email updates...</label>

Maybe you should use a paragraph (p) tag.

[Dan Schulz]

You need to have your label associate itself with the ID it is referring to using the for="" attribute. This attribute's value must be identical to the ID of the input that it refers to.

In your second example, "sdate" should be changed to "slocation" as well.

[GonzaloGM]

Yeah, but I think he wanted to place a text (not a label for a field). If that's the case he shouldn't use a label in my opinion.

[felgall]

Labels are intended to be associated with form fields. Using one and not associating it with a specific form field will fail accessibility validation as this one has done.