References

Beginner-friendly references for web development, with live, editable examples.

The HTML disabled attribute

Attribute All modern browsers Updated
Quick answer

The HTML disabled attribute disables the control so it cannot be interacted with or submitted. It is used on form controls such as <input>, <button>, <select>, <textarea>, <option>, <optgroup> and <fieldset>.

Overview

The disabled attribute disables the control so it cannot be interacted with or submitted. It applies to form controls such as <input>, <button>, <select>, <textarea>, <option>, <optgroup> and <fieldset>.

A disabled control is skipped in the tab order, not submitted, and styled grayed-out. Disabling a <fieldset> disables all controls inside it. If you need it focusable/announced, use aria-disabled instead.

Syntax

<button disabled>Unavailable</button>

Values

Value
A boolean attribute — present or absent.

Example

Live example
<button disabled>Can't click</button> <input value="Locked" disabled style="padding:8px;">

Best practices

  • Give every control a <label> so it has an accessible name.
  • Treat client-side constraints as a convenience — always validate again on the server, since they can be bypassed.
  • Choose the most specific input type so users get the right on-screen keyboard and built-in checks.
  • Keep the submitted name and value meaningful for whatever processes the form.

Frequently asked questions

What does the disabled attribute do?
Disables a form control.
Are HTML form attributes enough for validation?
They give instant feedback, but client-side checks can be bypassed, so always validate on the server too.
Do form controls still need a label?
Yes. Every control needs a <label> for an accessible name, whatever attributes you set.
Which elements use the disabled attribute?
It is an element-specific attribute, used on form controls such as <input>, <select> and <textarea>.