Angular 2 new form(0.2.0), on submit redirecting to same page with form fields are appended to URL as query params with new Router(3.0.0-beta.1)

I was updating my old running application to newer angular version. It was working good with older version.

On one of my page, I have used form, so when I updated angular/forms to 0.2.0 version with component router version 3.0.0-beta.1. The issue I’m facing is when I tried to submit form, it redirects to same page and appending all the entered value in query parameter.

Here is Plunkr with Problem statement

Steps to reproduce issue:

1. You will get landed on “CRISIS CENTER” page, select any record from it.
2. Edit some text, and then click on submit button & check the URL in navigation bar.

Note

1. I’m using template driven form(I don’t think so this will make any difference).
2. Open Plunkr in Preview window(new tab where you can see running application URL)

[Ferhatos]

EDIT : I found a workaround/solution

I found a workaround/solution. Just return false on submit function 😉

HTML <form class="card-block" role="form" #form="ngForm" novalidate (ngSubmit)="onAction(save)"> Type Script onAction(action) { this.action.emit(action); return false; }

stackoverflow stackoverflow - origin

History

Hi, I have the same problem. I just wanna submit a form in a Modal. I’m using ng2-bs3-modal@0.10.4. In other forms where I refresh or navigate to another route, I have no probleme. But in case using modal, I didn’t want to refresh/navigate to URL. But the URL is updated with form fields.

• Without form tag, I can’t submit with enter-press-Key.
• Without naming all the fields of the form, the URL still updated with just a ? before the #

Any workaround is welcome. Thanks.

[xuwenqing2014]

sorry, I met the same problem too. The button can work normally in my local environment, but when I use ‘ng build --prod --output-hashing=none’ to build my code, the button will redirect to a url to refresh current page. it can be reproduce in the website ‘http://jpush-ui.jpushoa.com/#/login’. please.