Validating forms with Regular Expressions (Javascript Regex)

Question

I have an input form which needs to be validated in real time (.Keyup and .Load)

It should allow all A-z characters (Upper & lower) and the symbols "'", "-" and " " (apostrophe, dash and whitespace).

At the moment this is what I have: ([A-Za-z]-\s\')* and I'm using it like this:

var regex = /([A-Za-z]\-\s\')*/;
if (string == "") {
  turn textbox border grey (default)
} else if (!regex.test(string)) {
  turn textbox border red
} else {
  turn textbox border green
}

All it does it change the the textbox green every time (Unless it's blank - it goes grey). What's the correct expression/technique and what am I doing wrong?

What is it that does not work? What are you expecting to happen? What is actually happening? — Justin Wood
– Justin Wood, Commented Nov 18, 2013 at 22:08
I've already answered these questions. What doesn't work: The regular expression test. What am I expecting: Read the code. If it meets the regex conditions then it should turn the input field you are typing into green. else it should turn red. It is grey when blank. What's happening: It turns green no matter what you type in. — pd93
– pd93, Commented Nov 18, 2013 at 22:10
So, if the key is a character they just released, ` ` or --------- or '''''''''''''''' are valid input? Can't you narrow that down to edge conditions of some type of actual final validation? — user557597
– user557597, Commented Nov 18, 2013 at 22:50

Andrew Clark · Accepted Answer · 2013-11-18 22:12:45Z

3

You need something like the following:

var regex = /^[A-Za-z\-\s']*$/;

The ^ and $ are beginning and end of string anchors, respectively. Without these the match could start or end anywhere in the string. Since * means "repeat the previous element zero or more times" you will match every string no matter the contents because the regex can successfully match zero characters.

The other issue with your current regex is that [A-Za-z]\-\s\' will try to match a letter, a dash, a single whitespace character, and an apostrophe in order (4 characters total). To match any one of those options you need to put them all inside of the character class (square brackets), or use alternation with the pipe character (|) which would look like ([A-Za-z]|-|\s|'). Alternation is more general but character classes are the preferred method for something like this.

Regarding the escaping, apostrophe has no special meaning in regular expressions so it does not need to be escaped. A dash only needs to be escaped if it is inside of a character class (if it isn't escaped it is interpreted as part of a range).

answered Nov 18, 2013 at 22:12

Andrew Clark

210k36 gold badges285 silver badges310 bronze badges

Sign up to request clarification or add additional context in comments.

12 Comments

Shawn G. Over a year ago

I was just about to post that. Haha you beat me to it! +1

pd93 Over a year ago

does the apostrophe not require a backslash before it?

Andrew Clark Over a year ago

@Pete Edited my answer with some more info about the escaping, no need for the backslash before the apostrophe (although the regex should work the same way if you include it).

Andrew Clark Over a year ago

@ShawnGrav \w will also match underscores and digits, but you could use [a-z] or [A-Z] with the i flag.

plalx Over a year ago

@ShawnGrav \w is not equivalent to [A-Za-z]. \w will also match numbers and _.

|

Collectives™ on Stack Overflow

Validating forms with Regular Expressions (Javascript Regex)

1 Answer 1

12 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

12 Comments

Your Answer

Sign up or log in

Post as a guest

Related