7 0
31.4k times

Basically what I want to do is this:

<form method="POST" action="https://www.google.com/asdf.cgi" action="http://www.asdf.com/blah.pl">

Obviously, you cannot have multiple action attributes in an HTML form tag, but it's the idea that I am after. I have had trouble finding a proper method to do this so that it actually submits to both actions on submit.

  • 0
    I'm not sure that would work; it'd only do one of them. What exactly is it that do you want to do? — Liquescence
  • 0
    I want to have one submit button perform multiple actions. Just like above, only that HTML won't work, and I'm not really good in javascript to where I can assign functions to perform the multiple actions. — ratt
add a comment

3 Answers

  • Votes
  • Oldest
  • Latest

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:

  1. Use Javascript to post Forms on two iframes
  2. 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.action = 'http://www.asdf.com/blah.pl';
myForm.target = 'iframe_2';


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 = new XMLHttpRequest();
xhr.open('POST', action2, true)
xhr.setRequestHeader('Content-type', 'application/json; charset=UTF-8')
add a comment

I didn't have time to test this extensively, but this is what I came up with off the top of my head, and it worked when I tried to submit it to two different formmail scripts:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">

<script type="text/javascript">
function doubleSubmit(f) 
    // submit to action in form

    // set second action and submit
    return false;
<form method="post" action="formmail.php" onsubmit="doubleSubmit(this)">
<input type="text" name="myTextBox"><br>
<textarea name="myTextArea"></textarea>
<input type="submit" value="Double Submit">
  • 0
    This looks great and all, but isn't it just submitting to one formmail? What i'm trying to do is have the form submit to two separate mailing lists. So when someone puts their email into the text box and clicks submit, they subscribe to my list and a neighbor sites list. I would think it would involve having two functions in the onsubmit() but I don't know how to write it where function 1 would be the action=* method=* and function 2 would be the same. I think something like onsubmit('function1();','function2();'); just a hunch. — ratt
  • 0
    No, it was submitting to formmail.php and formmail2.php, one happens via HTML, and the other happens via Javascript. However, there's a bug that I didn't see earlier. Internet Explorer keeps submitting to the second one twice. I'll try to look at it some more tomorrow. — RichB
add a comment

I don't have time to write out the code, but the way I would probably handle this is by, instead of using a form submit button, I would use a regular button with an onClick that populates some global JS variables with your form data, then opens two small popups.

Those popups would contain a form with only hidden fields that get populated by an onLoad function from the opener variables and then submits with the last action being a window.close();.

When the person clicks submit, these two windows popup and then close (best to put window.blur() on both, or window.focus() on the form window). Then, use a while loop (careful to avoid infinite loops...) to watch those two windows, and once both are closed, location.href to a thank you page.

Unfortunately, as you know, there is no way to do what you are talking about in pure HTML.

The other way is to chain your Perl scripts, so that, at the end of doing whatever the first one does, it forms an HTTP request and sends it to the second one. I've had a bit of success with doing this, though I was sending XML streams via HTTP from a Perl script to an ASP script (heh, don't ask, I one found myself writing a Perl script, to create ASP code that printed out JavaScript code that manipulated HTML. Makes you're head hurt just to think about it, and escaping quote marks was a bloody nightmare!)

  • 0
    Many thanks for the tip. I needed to do exactly this as I wanted to have a submit button send an email using my ISP's standard email CGI script. I then needed all the same data to be sent to my credit card processing company. I achieved it using your advice which was invaluable - thank you. — nickster
add a comment