bullprog
bullprog

Reputation: 144

Show the user many different error messages for different patterns in form control

I have a form, made in HTML, with Angular5. I'm using Form Validations and Form Controls to give a error messages if a validator isn't being follow.

Like this:

 this.password = new FormControl('', [Validators.required, Validators.minLength(8),Validators.pattern("^(?=.*?[A-Z])(?=.*?[a-z])(?=.*?[0-9])(?=.*?[#?!@$%^&*-]).{8,16}$"), Validators.maxLength(16)]);

If this validators, isn't being correct, so i show a error message to the user, indicate that we need to has a password, with this regular expression rules.

Now, i want to show the user this messages separately. For example:

The user writes on input for password the following string: 'A123'

I need to show him, that password still needs a lower case and a symbol. If he writes that missing params, so, the message will disappear.

Conclusion: I need to show the user, what rules are missing in string that he introduces in input. I don't want everthing in the same message, but separately.

Upvotes: 0

Views: 27

Answers (1)

emsimpson92
emsimpson92

Reputation: 1778

Try running several regex patterns through it and using IsMatch to validate.

if .*?[0-9].*? == false "Please enter a numeric character"

if .*?[A-Z].*? == false "Please enter a capital letter" (I don't believe this will work with accented characters)

if .*?[!@#$%^&*()_+\-=\[\]{};':"\\|,.<>\/?].*? == false "Please enter a special character"

if .{3,16} == false "Please enter a password between 3 and 16 characters.

I don't think there is a one size fits all method that can determine what is missing, it will only know that something is missing.

Upvotes: 1

Related Questions