monda monda - 5 days ago 6
AngularJS Question

ng-pattern to allow alpha and certain special characters

In form - name field I want to do a validation against


  • Should allow only Alpha characters

  • Allow space

  • Allow certain special characters -
    _ \ / - . ’



I tried,

ng-pattern="/^[a-z]+[_+\+/+-+.+’][a-z]*$/"


Looks like I have missed out something as its not working!

Answer

Let's see:

  • Should allow only Alpha characters => [a-zA-Z]
  • Allow space => [ ] or \s
  • Allow certain special characters - _ \ / - . ’ ' => [_\\\/.’'-]

So, combining all that, the pattern will look like:

ng-pattern="/^[a-zA-Z _\\\/.’'-]+$/"

This matches 1 or more (+) chars from the allowed set.

To disallow leading/trailing whitespace, use

ng-pattern="/^[a-zA-Z_\\\/.’'-]+(?: +[A-Za-z_\\\/.’'-]+)*$/" ng-trim="false"

See the regex demo

The ng-trim="false" will prevent from trimming the input sent to the regex engine. The new regex will match:

  • ^ - start of string
  • [a-zA-Z_\\\/.’'-]+ - 1 or more letters or allowed symbols other than space
  • (?: +[A-Za-z_\\\/.’'-]+)* - zero or more sequences of:
    • + - (or, \s+) - 1 or more spaces (whitespaces)
    • [A-Za-z_\\\/.’'-]+ - see above
  • $ - end of string.
Comments