Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Angular2: how to post+redirect form with action on external site

I have a form on an Angular2 webpage.

When I hit submit on the form, I'd like the equivalent of " method="post".....> to happen.

That is, the action script for the form is on another website, and I'd like to just post the form to that website. And to then be on that external site.

I'm beating my head against a brick wall on this; the Submit button appears to have been taken over by Angular, so just hitting Submit does nothing. I know how to do this when I need to handle the data asynchronously, but not when I want to just move to that external site.

I don't need any fancy Angular validation, etc, just to post the form to the external site, and then be on that site.

I've been reading and googling, and the only suggestion offered appears to be doing a http.post, then subscribing to the promise, then redirecting. But how does that redirect handle the data I want to submit with the form?

Any pointers welcome, thanks. Rachel

like image 227
Rachel Avatar asked Oct 25 '16 07:10

Rachel


2 Answers

Thanks to the angular2-forms tag which showed up as an option when I posted this, I think I have found the answer at Angular2 ngNoForm and also do angular form validation

There is a (rather undocumented) option on ngForm "ngNoForm" which removes the automatic ngForm handling from this specific form. This gives me back the standard use of the Submit button, and gets the behaviour I need.

like image 153
Rachel Avatar answered Sep 18 '22 10:09

Rachel


I use the pure Angular JS html to implement this requirement.

<form ngNoForm action="https://your_url" target="_blank" method="POST">
  <input hidden name='backEndUrl' [(ngModel)]="parameters['backEndUrl']">

  <input hidden name='bankNumber' [(ngModel)]="parameters['bankNumber']">
  ...
  <input hidden name='version' [(ngModel)]="parameters['version']">
  <div class="container text-center mt-10">
  <button class="btn-primary" type="submit" onclick="submit()">send</button>
 </div>
</form>
like image 38
Sky Pan Avatar answered Sep 18 '22 10:09

Sky Pan