disabled

disabled attribute

The disabled attribute in HTML is used to disable elements such as <button>, <input>, checkboxes, radio buttons, and dropdowns. It visually shows the element as inactive and prevents any user interaction.

Syntax

<tag disabled></tag>

Example

A disabled button shows that an action isn't available yet, such as a "Submit" button that becomes active only after the form is completely filled out.

<form>
  <input type="text" required />
  <input type="text" required />
  <button disabled>Submit</button>
</form>

Why we use disabled attribute?

The disabled attribute in HTML serves to:

• Block User Interaction: It prevents users from interacting with elements like <input>, <button>, checkboxes, radio buttons, or dropdowns.
• Show Inactive State: It visually communicates that an element is inactive or not available for use.
• Manage Form Submission: It ensures certain form elements aren’t submitted or altered, helping to maintain data integrity or limit user input based on conditions.

Values

• The disabled attribute is a boolean attribute, meaning it doesn't require any values.

Applies to

The disabled attribute can be applied to the following HTML elements:

Conclusion

The disabled attribute in HTML prevents user interaction with elements, marking them as inactive and ensuring that they can't be submitted in forms. It's commonly used for <button>, <input>, checkboxes, and other form elements. This attribute helps manage user input and maintain data integrity in web forms.