I have two forms and a button. Everything works fine in Firefox. I get a new window, with a Paypal payment, and in the window where everything happened i get the send_mail form submitted that will send an e-mail to the user. How can I make this work in Chrome? Why it's not working? I've tried anything (or so I think)!

So:

<form name="registerForm" id="registerForm" target="_blank" action="paypal_url" method="post" onsubmit="$('#send_mail').submit();">
...
</form>

<form name="send_mail" id="send_mail" action="" method="post">
...
</form>

<a onclick="$('#registerForm').submit()">Go to paypal and send confirmation mail</a>

I have two forms and a button. Everything works fine in Firefox. I get a new window, with a Paypal payment, and in the window where everything happened i get the send_mail form submitted that will send an e-mail to the user. How can I make this work in Chrome? Why it's not working? I've tried anything (or so I think)!

So:

<form name="registerForm" id="registerForm" target="_blank" action="paypal_url" method="post" onsubmit="$('#send_mail').submit();">
...
</form>

<form name="send_mail" id="send_mail" action="" method="post">
...
</form>

<a onclick="$('#registerForm').submit()">Go to paypal and send confirmation mail</a>

• javascript
• jquery
• google-chrome
• onsubmit

• 2 onsubmit is not fired when using submit(). – pimvdb Commented Feb 23, 2011 at 16:15

3 Answers 3

Unless you have a really good reason to use a javascript-only submit, why set up the form to be unusable if there is a javascript error?

Use a standard form input of type submit, give it an id, alter the look or text of the submit via javascript as necessary, and create onclick & onsubmit events as a layer on top of that functionality and have them return false. Better fallbacks.

I'm not sure why you're trying to submit two forms at once, but how about this alternative (note that I haven't tested this code, but it should convey the idea):

<script type='text/javascript'>
$('#fallback-register-submit').hide(); // Hide the submit button.
$('#registration-link').show().click(function (){ // Show the link and attach the action.
    $('#registerForm').submit();
    return false; // Don't bother following the link anchor.
});
</script>

<form name="registerForm" id="registerForm" target="_blank" action="paypal_url" method="post""><!-- Single form that does all of the submitting. -->
...
...
<input type='submit' id='fallback-register-submit'>Register</input><!-- In the event of a javascript error for their browser, they can still buy your stuff! -->
<a id='registration-submit' style='display:none'>Go to paypal and send confirmation mail</a>
</form>

why not just bind both submits to your a?

onclick="$('#send_mail').submit(); $('#registerForm').submit();"

if you want the other form to submit AFTER the first one:

onclick="$('#send_mail').submit( function() {$('#registerForm').submit();}); "

assuming you're using jquery here

As far as i understand, you want to submit the form using a link?

Why not use "plain" javascript then? Without jQuery: document.getElementById(....).submit()

Or link the submit event to the link in a normal jQuery way:

$(document).ready(function() {
 $(".yourLinkClass").click(function() { // or "#yourLinkId" for that matter
  $("#registerForm").submit();
 });
});

And you also could use the submit button ;)