Submit HTML form, two actions one button

Question

this is my form:

<form id="contact-form" method="post">

and I have to pass the data inside to two URLs by clicking this button:

<button onclick="sendButton();" type="submit" name="submit" class="btn btn-primary btn-lg login-button cont-submit center-block"><i class="fa fa-paper-plane" aria-hidden="true"></i> Send Request</button>

the button will trigger the javascript below:

function sendButton() { document.forms['contact-form'].action='excelReports.php'; document.forms['contact-form'].target=''; document.forms['contact-form'].submit(); document.forms['contact-form'].action='mailAnnual.php'; document.forms['contact-form'].target=''; document.forms['contact-form'].submit(); return true; }

Unfortunately, the javascript didn't help to pass the data successfully, I wonder if anyone knows the problem. Thank you!

Once a form submits, the window will transition to a new document, and all the scripts are canceled (the window preparing the clean slate for the next document); thus the second .submit() is never executed. You can do what you want using AJAX, though before that I would ask if there is any reason you don't submit to one URL which then performs both actions. There does not seem to be much sense in sending the same data twice to the same server. — Amadan
– Amadan, Commented Mar 9, 2020 at 4:02

Lukaaashek · Accepted Answer · 2020-03-09 05:44:51Z

Second submit will be never executed. You must use AJAX. For example:

function sendButton() { var form = document.getElementById('contact-form'); var formData = new FormData(form); var xhr1 = new XMLHttpRequest(); xhr1.open('POST', 'excelReports.php', true); xhr1.send(formData); var xhr2 = new XMLHttpRequest(); xhr2.open('POST', 'mailAnnual.php', true); xhr2.send(formData); return true; }

Collectives™ on Stack Overflow

Submit HTML form, two actions one button

1 Answer 1

Comments

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Related