0

Is it possible to submit form multiple times with different actions from HTML. i.e.

document.forms[0].action = "action1.do";  //It insert the data into database and redirect to other page in same tab. 
document.forms[0].submit();

document.forms[0].action = "action2"; // Its generate a report with data inserted by action1 in new tab.
document.forms[0].target = "_blank";
document.forms[0].submit();

Form are submitting twice but the problem is second one is submitting in between the first one completion.

Please help how can i make sure that the second form submission will happen only after the first one completed.

Adrian Wragg
  • 7,311
  • 3
  • 26
  • 50
PKG
  • 291
  • 1
  • 4
  • 16
  • You have javascript intercept the submit and then post the data to multiple scripts, but it seems the wrong way to do it. I'd think it'd be best to post normally, to one script on the server, and have that perform the multiple tasks. – i-CONICA Apr 30 '14 at 08:11
  • Send response like "success" from your action servlet, till that time disable that form and enable it when response is recieved – Voonic Apr 30 '14 at 08:11
  • Why do you want to submit it twice? – putvande Apr 30 '14 at 08:14
  • because with first one i am inserting the data and with second one generating a report with inserted data in new tab. – PKG Apr 30 '14 at 08:18

2 Answers2

1

You need to send the form submit as an ajax request and disable the form when you do. Once the request responds you then in the callback from that enable the form/send the next request/etc.

Tim B
  • 40,716
  • 16
  • 83
  • 128
0

Submitting is asynchronous: if you do a submit, JS will continue to run and the browser performs the operation in the background. (But it makes a copy of the form so yes, you're safe to do what you did.) Now if you want to WAIT for the first operation to complete and THEN submit the second action, you have a few options, of which the most elegant is az AJAX call, using jQuery, something like:

var formData = $("form").serializeArray();
$.post("http://whatever.xxx", formData, function() {
    //
    // here's your callback!
    // you want do the second submit here.
    //
});

In the callback function of the $.post() call, you make the other submit. Problem solved.

dkellner
  • 8,726
  • 2
  • 49
  • 47
  • Hi dkellner, Thanks for reply. i tried it but it is not work as i am sending multipart/form-data to my action. – PKG Apr 30 '14 at 09:17
  • There's an answer for that... http://stackoverflow.com/questions/5392344/sending-multipart-formdata-with-jquery-ajax – dkellner Apr 30 '14 at 09:52