Question:
Situation:
I have a page that contains an <iframe> of another, on this other page I have a simple HTML input element:
<input type="text" required="" pattern="[a-Z]{2,35}" tabindex="6" name="edtCidade" id="edtCidade">
I'm sure and I made sure that there is no event type assigned to it or code changing its properties.
However, every time I type, any key, it can be a number, it can be a letter, anything, every time I type it generates this error in the console:
SyntaxError: invalid range in character class
Example:
If I type "az123" I will get 5 SyntaxError errors in my browser console.
Important:
This error does not cause me any problems, it is insignificant but it is bothering me, and I would like to know the origin of it.
Question:
How to resolve this error? Why is he occasioned? I would like a detailed explanation.
Answer:
The error is associated with regular expressions, being caused by a range aZ (lowercase and uppercase Z ) in the pattern attribute.
As the pattern attribute is an element of the input included in HTML5 , the expression will be executed even without any additional plugins or events.
To accept both uppercase and lowercase letters, use [a-zA-Z] , as there seems to be no way to make the default case insensitive .
Note : in Chrome this exception does not occur, it just skips validation. So I assume you are using Firefox. 🙂