Is there a way in HTML (JavaScript) to write a regular expression to negate an exact string match?

I would like to make sure an input is not equal to "foo". Only "foo" must fail validation, but "fooo" must be allowed.

In other words, I'm looking for a negation of this regex:

<input pattern="^foo$" ...>

Is there a way in HTML (JavaScript) to write a regular expression to negate an exact string match?

I would like to make sure an input is not equal to "foo". Only "foo" must fail validation, but "fooo" must be allowed.

In other words, I'm looking for a negation of this regex:

<input pattern="^foo$" ...>

• javascript
• html
• regex
• validation

• 1 You can use a negative lookahead: <input pattern="^(?!foo$)" ...> – anubhava Commented Dec 22, 2017 at 5:42
• Possible duplicate of HTML5 pattern exclude words – Nir Alfasi Commented Dec 22, 2017 at 6:02
• It doesn't seem to work: codepen.io/smatric/pen/mprBMd – Mateusz Commented Dec 22, 2017 at 6:02

3 Answers 3

One possible way is bining start of string anchor (^) with negative lookahead that includes both the target string and end of string anchor ($):

/^(?!foo$)/

Demo.

But pattern pattern is funny in that account - it has to match something in the string, that's why the original approach doesn't work. This does work, however:

<input pattern="(?!foo$).*">

If Javascript is allowed, why not just negate the result of the match?

if (!yourString.match(/^foo$/)) {
    ...
}

You can use this regex:

\bfooo\b