0

I've got an input field that I want to validate and restrict the characters entered in it.

How do I show an error if the field contains anything other than the following ?

a-z
A-Z
0 to 9
!$%&*:;#~@

I've tried using

If (/^(?=.*\d)(?=.*[a-z])(?=.*[A-Z])(?=.*[!$%&*:;#~@])[\da-zA-Z!$%&*:;#~@]$/.test(userin) === false) then alert 'xxxx';

But that doesn't seem to work. Any ideas ?

Thanks

Rob
  • 14,746
  • 28
  • 47
  • 65
Tom
  • 1,436
  • 24
  • 50

1 Answers1

4

Referencing my comment, you can use either of the following to catch any characters that are not in the list you presented.

a-z
A-Z
0 to 9
!$%&*:;#~@
[^a-zA-Z0-9!$%&*:;#~@]

Click here to see it in action. I did some keyboard smashing and, as you can see, it's grabbing the characters not found in the list.

If you want to present the user with an error surround the regex above with (regex here) and if your matches are greater than 0, reject the entry.

As per the generated code on regex101 (in the external link provided), you can test it using the following code.

const regex = /([^a-zA-Z0-9!$%&*:;#~@])/g;
const str = `afdskljfalsfhaljsf jdsalfhajslfjdsf haskjlfjdskfa sdfl;dasj fas kjdfs2345tg!@*%(&)&^%\$@#@!!\$%^&%(\$%\$##@\$@>?"{P}P@#!é45049sgfg~~~\`\`\`j;fad;fadsfafds
{":

    fd
:"L'KM"JNH¨MJ'KJ¨HN'GFDMG`;
let m;

while ((m = regex.exec(str)) !== null) {
    // This is necessary to avoid infinite loops with zero-width matches
    if (m.index === regex.lastIndex) {
        regex.lastIndex++;
    }

    // The result can be accessed through the `m`-variable.
    m.forEach((match, groupIndex) => {
        console.log(`Found match, group ${groupIndex}: ${match}`);
    });
}

In the above code, any matches are caught in the last forEach block and output to the console. You can use an if statement instead to output an error if matches occurred. Take a look at Check whether a string matches a regex, a post that explains how to test for matches

Use regex.test() if all you want is a boolean result:

/^([a-z0-9]{5,})$/.test('abc1');   // false

/^([a-z0-9]{5,})$/.test('abc12');   // true

/^([a-z0-9]{5,})$/.test('abc123');   // true

...and you could remove the () from your regexp since you've no need for a capture.

ctwheels
  • 21,901
  • 9
  • 42
  • 77
  • JavaScript doesn't support POSIX character classes. The second regex doesn't work and the first one should apply `^` and `$` anchors `^[^a-zA-Z0-9!$%&*:;#~@]+$` – revo Sep 11 '17 at 15:42
  • @revo, thanks I updated my answer and removed the POSIX character class (I've also updated the link). I won't add the assertions since the OP wants to ensure the string doesn't contain characters not found in the list, thus, there is no reason to check beginning or ending of string assertions – ctwheels Sep 11 '17 at 15:46
  • OP is checking for them if you re-check embedded code in their question however with your solution `if` condition should change a little. – revo Sep 11 '17 at 15:49
  • @revo, I added link to another question that enables OP to limit amount of code required to run the regex. I've also quoted it. – ctwheels Sep 11 '17 at 15:52