Angular2: how to post form with action on external site?

5,184 views
Skip to first unread message

Rachel Willmer

unread,
Oct 24, 2016, 7:01:51 PM10/24/16
to Angular
I have a form on an Angular2 webpage. 

When I hit submit on the form, I'd like the equivalent of <form action="<external-site>" 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

Rachel Willmer

unread,
Oct 25, 2016, 3:36:59 AM10/25/16
to Angular
This question doesn't seem to be getting many views in this group; I've re-posted it to StackOverflow. Please put any answers there.

Sander Elias

unread,
Oct 31, 2016, 1:17:11 AM10/31/16
to Angular
Hi Rachel,

In your form's component-controller, get hold of the form element, and just use JS to trigger the submit directly on it.

As you can't do this from within a web-worker, or server-side I would not worry too much about the direct dom references you need for this. I will give you a pure dom sample for the sake of simplicity. There are better/more angular way's to get this reference.

in your angular submit do something like this:

querySelector('form#myTargetFrom').submit()

Regards
Sander

Rachel Willmer

unread,
Oct 31, 2016, 6:06:38 AM10/31/16
to ang...@googlegroups.com
Thanks, Sander
Rachel
> --
> You received this message because you are subscribed to a topic in the
> Google Groups "Angular" group.
> To unsubscribe from this topic, visit
> https://groups.google.com/d/topic/angular/d3iQkM0exqQ/unsubscribe.
> To unsubscribe from this group and all its topics, send an email to
> angular+u...@googlegroups.com
> <mailto:angular+u...@googlegroups.com>.
> To post to this group, send email to ang...@googlegroups.com
> <mailto:ang...@googlegroups.com>.
> Visit this group at https://groups.google.com/group/angular.
> For more options, visit https://groups.google.com/d/optout.
Reply all
Reply to author
Forward
0 new messages