2

So. I follow the tutorial on build in validator and form validation on the official doc ->

One of the thing that chock me is that you can't know why you can't submit your form when something is wrong.

Take the plunker exemple they give in the doc: plunker -> https://plnkr.co/edit/TJUZlkKOv22PzPB7gHEK?p=preview

You can NOT click on submit, your mouse turn into a stop signal which is fine and normal.

But you have to check all over your form to find what you missed. I hope there would be a way to put a tooltip to show which field was required/falsy to at least explain to the user "something is wrong in what you did, check this particular field (which is paint in red but you look too d*** to understand)'.

Do you have any clue about how to access to form.valid and get some minimal explenation about why the form in not valid.

Improve this question
1
  • I don't understand, that plunker does show error messages, for example if you erase the name of the hero, it shows it's required. You can manage these error messages e.g if form is touched, dirty, pristine. Commented May 22, 2017 at 18:32

1 Answer 1

Reset to default
1

you can go for reactive form as in plunker 3 and have some expression like below to display user message, based on the validity condition.

<span *ngIf="!form.get('userData.email').valid && signUpForm.get('userData.email').touched" class="help-block">
            Please enter a valid Email!
</span>

Please let me know if your requirement is different.

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

3 Comments

!valid can be just invalid :)
I have some trouble understanding which is what, userData in particular. and not sure about signUpForm
signUpForm is formGroup, userData is formGroupName and email is formControlName.... This is the way you define reactive form.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.