logo

HTML disabled attribute

HTML disabled attribute disables the elements and prevents the clicks and user input from filling the form.

<p>First name:<input type="text" name="fname"></p>
 <p>Last name:<input type="text" name="lname" disabled></p>
</>

First name:

Last name:

Attribute values

All possible values of disabled attribute

disabled is a boolean attribute.

Related Tags

The tags that support disabled attribute

<button> tag

button element becomes unclickable because of disabled attribute.

<button disabled>Submit</button>
Try</>

<fieldset> tag

disabled attribute disables each and every element that is a descendant of the fieldset.

<form action="action.php" method="post">
  <fieldset disabled>
  <p>Name:<input type="text" name="uname"></p>
  <p>Email:<input type="email" name="email"></p>
  <p>Password:<input type="password" name="password"></p>
  </fieldset>
</form>
Try</>

<input> tag

input element becomes unclickable.

<p>Percentage: <input type="number" step="any" disabled></p>
Try</>

<optgroup> tag

optgroup element also supports disabled attribute.

<select>
 <optgroup disabled>
  <option>Subject1
  <option>Subject2
  <option>Subject3
  <option>Subject4
 </optgroup>
</select>
Try</>

<option> tag

option element represents one option in a list. An option in a list of options becomes uneditable.

<select>
 <option> Doctors
 <option> Engineers
 <option disabled> Polititians
 <option> Actors
</select>
Try</>

<select> tag

select tag disables all of the options that are descendent of the select element.

<select disabled>
 <option> option1
 <option> option2
 <option> option3
 <option> option4
</select>
Try</>

<textarea> tag

textarea tag defines resizeable textarea. It also supports disabled attribute.

<textarea cols="20" rows="20" disabled> </textarea>
Try</>

Was this article helpful?