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

PP-5366 - use inputmode on numeric fields #393

Merged
merged 1 commit into from
Jun 26, 2019

Conversation

jonheslop
Copy link
Contributor

@jonheslop jonheslop commented Jun 25, 2019

The Design System team have done some accessibility testing on input type="number" and deemed them problematic. They have suggested using

input type="text" inputmode="numeric" pattern="[0-9]*"

instead as documented here alphagov/govuk-frontend#1449

But because this is a currency input and we need to accept decimals points we’re going with

input type="text" inputmode="numeric" in this case

Copy link
Contributor

@alexbishop1 alexbishop1 left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Don’t we need to allow users to enter decimal points in this form? The pattern doesn’t allow that and I don’t know if inputmode="numeric" means we always get a keyboard with full stops.

@jonheslop jonheslop force-pushed the PP-5366-update-numeric-fields branch from d7cc402 to 59862b1 Compare June 25, 2019 12:38
@jonheslop
Copy link
Contributor Author

The pattern is [0-9.] so decimal points are allowed it brings up this keyboard in iOS 12.2

inputmode-numeric

@alexbishop1
Copy link
Contributor

alexbishop1 commented Jun 26, 2019

But does using pattern mean one can experience the built-in browser validation error messages? If so, it might be better to just not include pattern at all.

The Design System team have done some accessibility testing on `input
type="number"` and deemed them problematic. They have suggested using

`input type="text" inputmode="numeric" pattern="[0-9]*"`

instead as documented here alphagov/govuk-frontend#1449
@jonheslop jonheslop force-pushed the PP-5366-update-numeric-fields branch from 59862b1 to d95ab44 Compare June 26, 2019 13:10
@jonheslop jonheslop changed the title PP-5366 - use inputmode and pattern attribute on numeric fields PP-5366 - use inputmode on numeric fields Jun 26, 2019
Copy link
Contributor

@alexbishop1 alexbishop1 left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

No pattern, no problem

@jonheslop jonheslop merged commit 0a492e2 into master Jun 26, 2019
@jonheslop jonheslop deleted the PP-5366-update-numeric-fields branch June 26, 2019 15:03
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

2 participants