• Register
0 votes
208 views

Problem :

I want to know why I keep facing below error while I try to check my page on http://validator.w3.org/check The error is as below :

 

Line 300, Column 90: The for attribute of the label element must refer to a form control.
… <label for="myname" style="line-height:30px;">My Name</label><br>&nbsp;&nbsp;

here is my actual code

<div>&nbsp;&nbsp;
  <label for="myname" style="line-height:30px;">My Name</label><br>&nbsp;&nbsp;
  <input class="css_form_namefield TooltipIstok " type="text" name="myname" value="" style="width: 600px;" maxlength="60" >
</div>

 

6 5 3
7,540 points

Please log in or register to answer this question.

2 Answers

0 votes

Solution :

By definition, your for attribute value must match your id attribute value of “another” form control, to use your HTML 4.01 terminology. The  Controls are created by the input, textarea, button, select, or any object elements, so you need to just read “another” as “a”. HTML5 understands it very differently, specifying that your attribute must refer to the labelable element.

From your error message, it is clear that you are trying to validate against HTML5, so your rule that will apply  is that your for attribute must be referring to the button, input other than the with type=hidden keygen,/meter/output/progress/select, or the textarea element. My suggession is that you must have forgotten the id attribute and you are incorrectly assuming that your name attribute could do the job for you.

I hope my suggestions will help you in resolving your issue.

9 7 4
38,600 points
0 votes

Solution:

What This Implies

This error is saying you that a <label> within a <form> uses a for attribute inaccurately.

The for attribute of a <label> is employed to associate a label with appointed form input. It should comprise the id of the input to which it is associated. Leaving the for attibute blank or referring to an input that does not subsist is not approved.

The label for attribute should comprise the input id value

<label for="foo">Foo:</label>
<input id="foo">

To throw away the for and id attributes all-together, place input inside label

<label>
    Foo: <input name="foo">
</label>

Further note, that input cannot be hidden <input type="hidden">, but it can be styled as hidden <input style="display:none">

In case you employ the for attribute in a label element it has to match the id of an input element in your form.

<label for="field-id" style="line-height:24px;">Your Name</label><br>&nbsp;&nbsp;
<input type="text" id="field-id">

By definition, the for attribute value should match the id attribute value of “another” form control, to employ the HTML 4.01 terminology. Controls are made by inputtextareabuttonselect, or object elements, hence only read “another” as “a”. HTML5 puts this somewhat diversely, secluding that the attribute should refer to a labelable element.

From the error message, it appears that you are validating against HTML5, hence the rule that executes is that the for attribute should refer to a buttoninput (other than with type=hidden), keygenmeteroutputprogressselect, or textarea element. My guess is that you only forgot the id attribute, inaccurately pretending that the name attribute could do its job.

10 6 4
31,120 points

Related questions

0 votes
2 answers 536 views
536 views
Problem : Facing following strange error the value of the for attribute of the label element must be the id of a non-hidden form control.
asked Nov 12, 2019 peterlaw 6.9k points
0 votes
1 answer 5 views
5 views
Problem: I need someone&rsquo;s assistance to solve my problem .. allow only numbers in textbox html
asked Apr 21 Ifra 34.7k points
0 votes
1 answer 8 views
8 views
i am getting the problem of which of the following classes would you use on a div element that contains a label and a control?
asked Apr 7 ashik 14.6k points
0 votes
1 answer 3 views
3 views
Problem: Can anyone help to solve this issue > Autocomplete attribute not disabled for password in form based authentication
asked 6 days ago ummeshani 8.8k points
0 votes
1 answer 3 views
3 views
Problem: I am stuck during learning as I have already mentioned in my question someone please cooperate me to continue my project-Thanks
asked Mar 23 shamimkhan 15.1k points
0 votes
1 answer 3 views
3 views
Problem: Can someone please help fix this > You should add a type attribute with a value of text/css to the link element
asked 5 days ago ummeshani 8.8k points
1 vote
1 answer 2.1K views
2.1K views
Problem : I am very new to Angular 4. Please find below my component in Angular 4: @Component( { selector: 'input-extra-field', template: ` <div class="form-group" [formGroup]="formGroup" > <switch [attr.title]="field.etiquette" [attr.value]="field.valeur" ... .../../../forms/@angular/forms.es5.js.FormControlDirective.ngOnChanges (forms.es5.js:4617) Please guide me in fixing above Angular 4 error.
asked May 11, 2020 stewart 4k points
0 votes
1 answer 10 views
10 views
Problem: Is there a way that I can undo or remove this focus when hovering over a certain element? (The focus does not have to be reset after leaving this element.) Thanks
asked Mar 17 ummesalma 29.2k points
0 votes
1 answer 78 views
78 views
Problem : I am facing below error if I try to export datagrid to the excel. &ldquo;Control 'gridview1' of type 'gridview' must be placed inside a form tag with runat=server.&rdquo; Please find below my code : <form runat="server" id="form1"> <div runat="server" id=" ... TextBox> </form> My GridView is within the from tag with the runat="server", but still I am facing above error. How to fix this?
asked Feb 17, 2020 mphil 2.3k points
0 votes
1 answer 7 views
7 views
Problem: I am stuck during learning as I have already mentioned in my question someone please cooperate me to continue my project-Thanks
asked Mar 30 rakib1 51.5k points