HTML check: Bad value X for attribute “required” on element “Y”.

About This HTML Issue

required is a boolean attribute, so on <input>, <select> and <textarea> you write it bare, empty or as required="required", and a value like "true" or "false" is an error.

The HTML standard allows two values for a boolean attribute: the empty string and the attribute's own name, in any letter case. So required, required="", required="required" and required="REQUIRED" all pass. The validator reports any other value with this message and quotes what it found: "true", "false", "1", "yes", and also "required " with a trailing space.

Browsers don't read the value at all. If the attribute is there, the field is mandatory, so required="false" blocks the form just like required="true" does. To make a field optional, remove the attribute.

The bad value usually comes from a form builder or template that writes a boolean setting straight into the markup, often with aria-required="true" next to it. Once you fix required, the validator warns that aria-required is unnecessary on an element that has required, so remove it too. From JavaScript, set the property (field.required = false) or call removeAttribute("required"). Calling setAttribute("required", "false") leaves the field required.

Some details depend on the element:

<input>: required only applies to types a user can leave empty or unchecked: text, search, email, url, tel, password, number, the date and time types, checkbox, radio and file. On hidden, range, color and the button types (submit, reset, button, image), it isn't allowed at all, and the validator says so in a separate error. Remove it there instead of fixing the value.
<textarea>: a required text area blocks the form while its value is empty. The text between the opening and closing tags is the starting value, so spaces a template adds for indentation make the field count as filled in before anyone types. Put </textarea> right after the opening tag.
<select>: a required drop-down (no multiple, and no size above 1) needs a placeholder as its first <option>, with value="" and directly inside the <select>, not in an <optgroup>. An option without a value attribute uses its text as its value, so <option>Choose a size</option> counts as an answer, and the form submits "Choose a size" if the user never opens the list. When the first option isn't a valid placeholder, the validator reports a second error about it, even while required has a bad value.

Invalid example

<form action="/order" method="post">
  <label for="email">Email</label>
  <input type="email" id="email" name="email" required="true">

  <label for="size">Size</label>
  <select id="size" name="size" required="true">
    <option value="">Choose a size</option>
    <option value="s">Small</option>
    <option value="m">Medium</option>
    <option value="l">Large</option>
  </select>

  <label for="notes">Notes (optional)</label>
  <textarea id="notes" name="notes" rows="3" required="false"></textarea>

  <button type="submit">Place order</button>
</form>

Valid example

<form action="/order" method="post">
  <label for="email">Email</label>
  <input type="email" id="email" name="email" required>

  <label for="size">Size</label>
  <select id="size" name="size" required>
    <option value="">Choose a size</option>
    <option value="s">Small</option>
    <option value="m">Medium</option>
    <option value="l">Large</option>
  </select>

  <label for="notes">Notes (optional)</label>
  <textarea id="notes" name="notes" rows="3"></textarea>

  <button type="submit">Place order</button>
</form>