12

I'm trying to create something right now and I need the pattern attribute that was introduced in tp be case-insensitive but as far as I know, you can't have flags to do this.

There was a question asked in 2011 where it was stated that input patterns are case-sensitive and I was hoping that this was changed since then. If not, I'd like to know if there is a way to get a pattern to become case-insensitive. I can't just use the basic [a-zA-z] because I need to match a four letter word so as an example, it would start off really long (word)|(WORD)|(Word)|(wOrd)... and so on.

Is there a way to get a case-insensitive pattern like this?

EDIT:

Appears I haven't been to specific in my details, I need a specific word, not just any 4 letter word.

Community
  • 1
  • 1
Spedwards
  • 4,167
  • 16
  • 49
  • 106

2 Answers2

17

Ok I think I figured out an easier way to do the pattern other than listing each combination.

As an example, I'll use the word, "five".

[fF][iI][vV][eE]

so

pattern="[fF][iI][vV][eE]"
Spedwards
  • 4,167
  • 16
  • 49
  • 106
  • is there still not a better way? i am trying to match ~250 words, so this method would at least double the size of the "pattern" – oldboy Dec 25 '20 at 09:40
  • @oldboy In your case I'd have some JavaScript intercept the form submit and validate it within the script. The `pattern` attribute is still rather limited I'm afraid. https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/pattern – Spedwards Dec 26 '20 at 09:21
  • yeah, thats what i was using, but i wrote a script to generate the HTML pattern, so that i can scrap a bunch of JS that handled form validation, etc, and used the native browser validation in its stead – oldboy Dec 26 '20 at 09:38
1

You can use:

pattern="[A-Za-z]{4}"

For example:

<input type="text" name="username" required pattern="[A-Za-z]{4}" />

This input has to be filled up with four case-insensitive alpha characters.

Update: You didn't respond which specific words you want to match but you can do it like:

pattern="word|WORD|Word|wORD"

So, for example:

<input type="text" name="username" required pattern="word|WORD|Word|wORD" />

Find more variations if needed.

The Alpha
  • 143,660
  • 29
  • 287
  • 307
  • Sorry, should have been more specific. I'll edit the question but it has to be more specific. The actual word. – Spedwards May 25 '14 at 04:43
  • Explain what is that ? Which specific words ? – The Alpha May 25 '14 at 04:48
  • What word doesn't matter. It's just 1 four letter word. – Spedwards May 25 '14 at 04:56
  • is there any way (via a tag like `/pattern/i`, etc) to match any case of a pattern like the following pattern? `option1|option2|option3|...` -- i plan to include about 250 options, so using an HTML `pattern` that includes specified options (instead of the whole alphabet) is really only practical if there is some way to incorporate a case-insensitive tag – oldboy Nov 26 '20 at 22:44
  • What about `[A-Za-z0-9]*` zero or more alphanum chars. – The Alpha Nov 26 '20 at 23:39
  • sorry, what i meant was that i will be matching ~250 specific words, so is there a way to use flags in the HTML pattern regex (e.g. `g`, `i`, etc), so that the match is not case-sensitive (e.g. something like `pattern='/.../i'`)? – oldboy Dec 25 '20 at 09:40