org.sonar.l10n.web.rules.Web.InputWithoutLabelCheck.html Maven / Gradle / Ivy

Go to download

Show more of this group Show more artifacts with this name
Show all versions of sonar-web-plugin Show documentation

Enables scanning of HTML, and JSP/JSF files.

The newest version!

The <label> tag defines a label for <input>, <select> and <textarea>
elements.
The <label> tag does not render as anything special. However, it provides a usability improvement for mouse users: when the text
within the <label> element is clicked, the associated input field is toggled.
It also improves usability for visually impaired users: Screen readers will announce the label text whenever the focus is set on the input
field.
The for attribute of the <label> tag should be equal to the id attribute of the related element to
bind them together.
The purpose of this rule is to make sure that every input (except submit, button, image and
hidden inputs), select, and <textarea> field has an associated label element.
Noncompliant Code Example
<input type="text" name="firstname" />               <!-- Non-Compliant - no id -->

<input type="text" name="lastname" id="lastname" />  <!-- Non-Compliant - no matching label for "lastname" -->

<label for="address">Address</label>
<input type="text" name="address" id="address" />    <!-- Compliant -->

<input type="hidden" name="time" value="...">        <!-- Compliant - "hidden" type is excluded -->
<input type="submit" value="Send" />                 <!-- Compliant - "submit" type is excluded -->

Compliant Solution
<label for="firstname">First name</label>
<input type="text" name="firstname" id="firstname" />

<label for="lastname">Last name</label>
<input type="text" name="lastname" id="lastname" />

<label for="address">Address</label>
<input type="text" name="address" id="address" />

<input type="hidden" name="time" value="...">
<input type="submit" value="Send" />