# Bad value “"disabled"” for attribute “disabled” on element “input”.

> Canonical HTML version: https://rocketvalidator.com/html-validation/bad-value-x-for-attribute-disabled-on-element-input
> Attribution: Rocket Validator (https://rocketvalidator.com)
> License: CC BY 4.0 (https://creativecommons.org/licenses/by/4.0/)

Boolean attributes in HTML work differently from regular attributes. Their mere presence on an element makes them "true," and their absence makes them "false." According to the [WHATWG HTML specification](https://html.spec.whatwg.org/multipage/common-microsyntaxes.html#boolean-attributes), a boolean attribute may only have three valid representations:

- The attribute name alone (e.g., `disabled`)
- The attribute with an empty string value (e.g., `disabled=""`)
- The attribute with its own name as the value (e.g., `disabled="disabled"`)

Any other value — including seemingly intuitive ones like `"true"`, `"yes"`, or `"no"` — is invalid and will cause the W3C HTML Validator to report an error such as: **Bad value "disabled" for attribute "disabled" on element "input"** (or a similar message referencing whatever invalid value you used).

## Why this matters

**Standards compliance:** Using invalid values violates the HTML specification, which can lead to unpredictable behavior as browsers evolve.

**Misleading behavior:** A common pitfall is writing `disabled="false"` and expecting the input to be enabled. This does **not** work as expected — because the attribute is still present, the element remains disabled regardless of the value. This can lead to confusing bugs where developers think they're enabling a field but it stays disabled.

**Accessibility:** Assistive technologies rely on the DOM's interpretation of boolean attributes. While browsers typically handle invalid values gracefully by treating any present `disabled` attribute as true, sticking to valid values ensures the most consistent behavior across screen readers and other tools.

**Templating and frameworks:** This issue frequently arises when templating engines or JavaScript frameworks insert string values into boolean attributes. If your template outputs `disabled="true"` or `disabled="false"`, you should instead conditionally include or omit the attribute entirely.

## How to fix it

1. **Remove the value entirely** — just write the attribute name by itself.
2. **Use an empty string** — write `disabled=""` if your tooling requires an explicit value.
3. **Use the canonical form** — write `disabled="disabled"` if you need XHTML compatibility.
4. **To enable an element**, remove the `disabled` attribute completely rather than setting it to `"false"`.

## Examples

### Incorrect usage

These all trigger a validation error because the values are not valid for a boolean attribute:

```html
<input type="text" disabled="yes">
<input type="text" disabled="true">
<input type="text" disabled="false">
<input type="text" disabled="1">
<button disabled="no">Submit</button>
```

Note that `disabled="false"` and `disabled="no"` still disable the element — the browser sees the attribute is present and treats it as true.

### Correct usage

All three of these are valid ways to disable an input:

```html
<input type="text" disabled>
<input type="text" disabled="">
<input type="text" disabled="disabled">
```

To have an enabled input, simply omit the attribute:

```html
<input type="text">
```

### Handling dynamic values in JavaScript

If you need to toggle the disabled state dynamically, use the DOM property rather than setting an attribute value:

```html
<form>
  <input type="text" id="username">
  <button type="button" id="toggle">Toggle</button>
  <script>
    document.getElementById("toggle").addEventListener("click", function () {
      var input = document.getElementById("username");
      input.disabled = !input.disabled;
    });
  </script>
</form>
```

Setting `element.disabled = true` or `element.disabled = false` in JavaScript correctly adds or removes the attribute from the DOM without producing invalid markup.

### Other boolean attributes

This same rule applies to all boolean attributes in HTML, including `checked`, `readonly`, `required`, `hidden`, `autoplay`, `loop`, `muted`, and others. For example:

```html
<!-- Incorrect -->
<input type="checkbox" checked="true">
<input type="email" required="required_field">

<!-- Correct -->
<input type="checkbox" checked>
<input type="email" required>
```

When in doubt, use the simplest form: just the attribute name with no value. It's the most readable, the most concise, and fully compliant with the HTML specification.