Honestly, I would probably write a script that you POST to, and then behind the scenes, your script would handle any dirty work of submitting the values/content to multiple providers. That would solve multiple problems and simplify your code so that you don't even need to use Javascript. However, I am not going to go into the details of how to write that script.
Instead to solve the actual question here you cannot achieve this via HTML alone (as previously mentioned), however, you can achieve this using Javascript. The main issue is that when you submit on HTML the page takes you to a new location and we cannot do that otherwise we are only going to be submitting to one of the destinations. So there are two ways we can do this:
- Use Javascript to post Forms on two iframes
- Use AJAX which allows you to POST without changing your current page
Javascript POSTing using Iframes
You could do this via having two iframes on the page where you have JavaScript target a form submit in each iframe:
let myForm = document.getElementById('subscribe');
myForm.action = 'https://www.google.com/asdf.cgi';
myForm.target = 'iframe_1';
myForm.submit();
myForm.action = 'http://www.asdf.com/blah.pl';
myForm.target = 'iframe_2';
myForm.submit();
AJAX POSTing
An easier way may simply be to use AJAX to POST multiple times to your destination. Here is a quick and dirty example that could probably be cleaned up so you re-use code with functions:
// Any data you want sent with the POST request
let data = {
field1: 1,
field2: 'a string',
}
let postData = JSON.stringify(data);
let action = 'https://www.google.com/asdf.cgi';
let action2 = 'http://www.asdf.com/blah.pl';
let xhr = new XMLHttpRequest();
xhr.open('POST', action, true)
xhr.setRequestHeader('Content-type', 'application/json; charset=UTF-8')
xhr.send(postData);
xhr = new XMLHttpRequest();
xhr.open('POST', action2, true)
xhr.setRequestHeader('Content-type', 'application/json; charset=UTF-8')
xhr.send(postData);
add a comment