Jack
Jack

Reputation: 339

A form label must be associated with a control - jsx-a11y/label-has-associated-control

I have a html code block as in below in my react application which throws "A form label must be associated with a control" eslint warning under jsx-a11y/label-has-associated-control.

 <input id="select" type="file" onChange={(e) => onChangeImage(e)} />
 <label htmlFor="select" className="">
    <SecondaryButton size="sm" label=“submit" />
 </label>

If I add {/* eslint-disable-next-line jsx-a11y/label-has-associated-control */} eslint comment before <label> line in above it will work. But I need to globally fix that issue if we can change via the eslint rule file. Any help would be highly appreciated.

Upvotes: 0

Views: 94

Answers (0)

Related Questions