angular 4 - reset template driven form validation after form submission

Question

My form opens like so:

<form novalidate #f="ngForm" (ngSubmit)="addPage(f)">

However, after successful submission I stay on the page and then validation messages pop up even though i don't want them to, so how do I reset form after submission?

The method that submits the form goes like so:

addPage({ value, valid }) {

I tried squeezing in f in there and then doing f.resetForm() but that didn't work out.

Can you provide fiddle demonstrating your issue? – artgb Oct 02 '17 at 15:34 — artgb, Oct 02 '17 at 15:34
are you calling reset in the addPage() method? – FussinHussin Oct 02 '17 at 17:48 — FussinHussin, Oct 02 '17 at 17:48

score 2 · Answer 1 · answered Oct 02 '17 at 17:55

2

Try doing this (not sure where you tried to squeeze f in),

<form novalidate #f="ngForm" (ngSubmit)="addPage(f); f.resetForm()">

See if that worked. Hope it helps.

answered Oct 02 '17 at 17:55

amal

3,140
1
13
20

score 0 · Answer 2 · answered Oct 02 '17 at 18:03

0

There exists form property by default on which reset() can be called so it should be:

addPage({form, value, valid }) {
        form.reset();
        // rest of code

answered Oct 02 '17 at 18:03

Vojislav Kovacevic

1,385
2
17
28

angular 4 - reset template driven form validation after form submission

2 Answers2