How To Create A RegEx in Javascript to Validate an Inputbox

Question

I haven't done one before and I need to create a RegEx to validate an input box. # represents a numeric and X represents a letter. The format is:

11111 - XXXXXXX

or

11111 - XXXXXXX-XXXXXXXX XXXX

The inputbox has an autocomplete that is pulling from the database and returns a list that games with an ID followed by the organization name.

Such as:

1234 - Benjamin Franklin ISD
1234134 - Benjamin Franklin ISD - Humanities District
123434 - Benjamin-Franklin ISD
1234441 - Benjamin Franklin ISD Accelerated

Basically, the numbers before the first - are the ID and anything following is the name of the organization that can possibly have a - inside of it.

How do I handle it to where it can allow for both possible entries?

Any help would be greatly appreciated for the regex and/or resources!

Casimir et Hippolyte · Accepted Answer · 2013-06-19 17:02:54Z

4

you can use this pattern:

/^\d+(?: *- *[a-zA-Z0-9 ]+)+$/

examples of use:

var yourString = "1234441 - Benjamin Franklin ISD Accelerated";
var pattern = /^\d+(?: *- *[a-zA-Z0-9 ]+)+$/; 
if (pattern.test(yourString))
    ... true ...
else
    ... false ...

or with RegExp

var pattern = new RegExp("^\d+(?: *- *[a-zA-Z0-9 ]+)+$");
if (pattern.test(yourString)) ...

note that you must remove delimiters and put the possible flags as second parameter when you use the RegExp constructor (the object syntax). However pattern is a RegExp object in both cases.

explanation:

^               begining of the string
\d+             one or more digits
(?:             non capturing group
 *              a space zero or more times
-               literal -
 *              a space zero or more times
[a-zA-Z0-9 ]+   a letter, a digit or a space one or more times
)+              close non capturing group, one or more times
$               end of the string

edited Jun 19, 2013 at 17:02

answered Jun 7, 2013 at 20:02

Casimir et Hippolyte

90k5 gold badges102 silver badges131 bronze badges

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

3 Comments

Richard Over a year ago

Hi @casimir, thanks for your help. I've tried the regex and it returned false for my test string "10 - REGION 10" I tried adding numerics into the non capturing group as: orgIdRegEx = new RegExp("/^\d+(?: *-*[a-zA-Z0-9 ]+)+$/"); It returns false. The original pattern that you had created returned false for the same test string. What can I do to adjust this? Thanks again!

Casimir et Hippolyte Over a year ago

@Richard: With the RegExp syntax you must not write the delimiters, remove slashes at the begining and at the end. See my edit for more explanations.

Richard Over a year ago

Thanks for all your help. I see why the delimiters are needed now. The odd thing is that when I use the RegExp verbatim from what you have above, it doesn't work. The pattern method with the delimiters work fine. Is it because I should be passing something in the flags parameter? I looked at w3schools.com/jsref/jsref_obj_regexp.asp and I put 'i' since it is case insensitive.

Joseph Myers · Accepted Answer · 2013-06-07 22:09:33Z

1

Two solutions:

the first one is designed to be used using .test to return true or false.

var orgIdCheck = /\d+\s*-\s*[-\w\s]+\w/;
var validId = orgIdCheck.test(*possible org ID string*);
if (validId) {} /* do something */
else {} /* do something else */

the second one is designed to return a two-element array containing the numeric ID and the organization name

var orgIdComponents = /(\d+)|(\w[-\w\s]*\w)/g;
var idParts = *validated org ID string*.match(orgIdComponents);
/* idParts[0] will be the numeric ID, and idParts[1] the name */

Note that the second regular expression doesn't check to make sure that the string contains both a numerical ID and a name, so you should validate using the first regular expression before using the second one. (The second one can return weird things if you don't validate the org ID string beforehand.)

Depending on how paranoid you are about bad inputs, you can put a caret ^ and dollar sign $ before and after the orgIdCheck expression (within the / and /). But you might end up getting false for some valid inputs, just because of extra spaces.

answered Jun 7, 2013 at 22:09

Joseph Myers

6,56229 silver badges36 bronze badges

4 Comments

Richard Over a year ago

Hi Joseph, thanks for your help. I tested the regex at regular-expressions.info/javascriptexample.html and it returned as a false. Looking above at Casimir's post, are we to designate the start of a string with ^ and closing with $? The organization name also includes numeric values. Not sure where that would go in your regex.

Joseph Myers Over a year ago

@Richard \w includes numeric values. Using my regular expression (without delimiters) \d+\s*-\s*[-\w\s]+\w your example 10 - REGION 10 returns an exact match.

Joseph Myers Over a year ago

@Richard another regular expression testing tool is mine here www.myersdaily.org/joseph/javascript/gx.html because you are able to specify your own modifiers (g, i, etc.). My regular expression testing tool requires you to give the entire regular expression using standard JavaScript literal syntax and also catches errors and gives you a debugging message when errors are found.

Joseph Myers Over a year ago

@Richard using my regular expression testing tool myersdaily.org/joseph/javascript/gx.html you can also test my second regular expression /(\d+)|(\w[-\w\s]*\w)/g and verify that it indeed returns two results, namely the numeric ID and the organization name. (Note that my regular expression testing tool needs the standard JavaScript notation including the delimiters and the modifiers, i.e., the / and /g.)

Collectives™ on Stack Overflow

How To Create A RegEx in Javascript to Validate an Inputbox

2 Answers 2

3 Comments

4 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

3 Comments

4 Comments

Your Answer

Sign up or log in

Post as a guest

Related