Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Add missing attributes for TextArea widget #1

Open
7 tasks
thomasmassmann opened this issue Dec 18, 2021 · 0 comments
Open
7 tasks

Add missing attributes for TextArea widget #1

thomasmassmann opened this issue Dec 18, 2021 · 0 comments
Assignees
Labels
enhancement New feature or request

Comments

@thomasmassmann
Copy link
Member

thomasmassmann commented Dec 18, 2021

The current widget lacks the following attributes:

  • autocomplete
  • autofocus
  • maxlength
  • minlength
  • placeholder
  • spellcheck
  • wrap

The following attributes will be omitted:

  • form: not required, as the field/widget is always placed inside a form

TextArea specification: https://developer.mozilla.org/en-US/docs/Web/HTML/Element/textarea

When the maxlength attribute is set, a character counter should be visible below the field showing both the current amount of characters inserted and the maximum amount of characters allowed. An example implementation is available at https://htmldom.dev/count-the-number-of-characters-of-a-textarea/:

0/200

When the minlength attribute is set, a character counter should be visible as with the maximum counter, showing both the current amount of characters and the minimum amount of characters required, and an additional “required” hint (translated):

0/10 required

In case both minlength and maxlength attributes are set, only the maximum counter should be shown. The minimum character information should be placed in parentheses:

0/200 (10 required)

An example from Adam Silver’s book “Form Design Patterns”:

Form hints above input

This version for the maxlength counter is more verbose, but should be taken only as an addition to the shortform (100/200):

You have 150 characters remaining (50/200).
@thomasmassmann thomasmassmann added the enhancement New feature or request label Dec 18, 2021
@thomasmassmann thomasmassmann self-assigned this Dec 18, 2021
@thomasmassmann thomasmassmann changed the title Add custom widget for TextArea Add missing attributes for TextArea widget Dec 19, 2021
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
enhancement New feature or request
Projects
None yet
Development

No branches or pull requests

1 participant