Error message or disabled action button

1. Why you shouldn't use disabled buttons?
2. What is a disabled button?
3. How do I enable disabled button?
4. Should you use disabled buttons?

Why you shouldn't use disabled buttons?

Bad accessibility

Sometimes disabled buttons are designed in a way that they cannot be read by a screen reader (buttons are not focusable, and hence users can't reach them with a keyboard). No need to explain that users with disabilities will face problems with such behavior.

What is a disabled button?

A disabled button is unusable and un-clickable. The disabled attribute can be set to keep a user from clicking on the button until some other condition has been met (like selecting a checkbox, etc.).

How do I enable disabled button?

To disable a button using only JavaScript you need to set its disabled property to false . For example: element. disabled = true . And to enable a button we would do the opposite by setting the disabled JavaScript property to false .

Should you use disabled buttons?

While designing the UI, avoid using a disabled button as it becomes hard to find out why it is disabled and what should be done to make it enable. It is better to keep buttons enabled all the time and highlight the field if users don't provide the required information.