Disabled Controls

Disabling text boxes: why it’s a bad idea and what to do instead

Why do we disable text boxes? Obviously, we don’t want the user to be able to change the values.

Then why show them in the first place? Perhaps because we still want the user to be able to view the content of the controls.

So, if we want the user to see the content, but we don’t want them to change it, what’s wrong with disabling the text box?

That’s the question I hope to answer in this article, as well as providing a few alternatives — including my recommended alternative.

Unfortunately, there are drawbacks to any solution for providing information that cannot be changed, including by using native HTML, specifically the disabled attribute.

Scope of this article: I’m only going to cover text boxes (<input type=”text”/>) in this article. Other controls that the developer would normally disable require unique changes to them to meet the below requirements. Covering all of those would make this article far too long.

Contents

Requirements

We’ll lay out what we hope to accomplish with the solution.

Why you shouldn’t disable text boxes

We’ll go over the problems with using the disabled attribute for textboxes.

Questionable solutions

We’ll talk about some proposed solutions to accomodate assistive technology users and why those solutions have pitfalls.

Possible alternative solutions

We’ll discuss some ways that have more promise with respect to accessibility and why. If you don’t want to read the whole article, skip to my recommended solution.

Conclusion

Links

Requirements

For our solution, we want to be able to:

1. Have content that the user can consume, regardless of whether they consume it visually or with assistive technology.
2. Prevent the user from being able to change the content.
3. Communicate to the user why they are unable to change the content.
4. Communicate to the user how they can change the content, if applicable.
5. Present the content in a way that is accessible…