How to require a specific input length and a 0-9 requirement using pattern attribute?

Question

I need to combine two patterns, however once I put them together using | both of them won't work.

How do you combine such patterns?

This is for an input field (on a form). I want to make the user type 13 characters precisely as well as require numbers only.

I tried: " pattern="(.){13,13}" maxlength="13" required>

This works. It requires 13 characters but also allows letters.

But once I add the second pattern for requiring numbers only, both patterns won't work.

" pattern="(.){13,13}|[0-9]*" maxlength="13" required>

I expect it to require 13 letters, using numbers only, but it doesn't require neither.

Any help/explanation is greatly appreciated. Thanks in advance!

Could you use some javascript to do that ? https://stackoverflow.com/a/469419/6809926 — Zenocode, Jul 03 '19 at 11:51
@antoinF If possible, I prefer to do this without javascript. — thefleur, Jul 03 '19 at 11:58

score 1 · Accepted Answer · answered Jul 03 '19 at 12:00

1

Use this line:

pattern=".{12,13}[0-9]"

It should only accept exactly 13 numbers, and no letters.

answered Jul 03 '19 at 12:00

1 Answers1