Search code examples
htmlaccessibility

Multiple form labels - Lightbox


I am editing html codes for web accessibility but I faced one problem about Multiple form labels. I am using Wave plugin to check web accessibility.

Errors is Multiple form labels What It Means A form control has more than one label associated with it.

The problem is that there is a page user can input user info, and a button to call pop up then the pop up has all same fields again to register if user did not input the field.

Instead of changing ID of the field in popup, is there any quick and easy way to remove the error?


Solution

  • From W3Schools:

    The id attribute specifies a unique id for an HTML element (the value must be unique within the HTML document).

    So yes, you need to define a unique ID for each and every component. This is the only clean way to solve your problem, otherwise a screenreader could read the wrong label when you focus one of your input fields.