scriptygoddess

23 Dec, 2006

Two submit buttons send form to two different pages

Posted by: Jennifer In: Javascript

Somewhat along the same lines as this older post

I had a "purchase" page where I wanted to allow the user to either purchase items on the site via credit card, or they could choose to pay via paypal. So two buttons. One that says "Pay with Credit Card" another that says "Pay with Paypal"… the paypal button should submit the form to paypal. The pay with credit card should submit the form to the next step on the site itself.

So in this case the form tag looks like this (with nothing in the value for action) :

<form name="paymentform" action="" method="post">

And the submit buttons look something like this:

<input type="button" name="paypal" value="Pay by PayPal" onClick="document.paypalForm.action='https://www.paypal.com/cgi-bin/webscr'; document.paymentform.submit();" />
<input type="button" name="creditcard" value="Pay by Credit Card" onClick="document.paymentform.action='paymentinfo.php'; document.paymentform.submit();" />

One thing to note – do NOT name any of the buttons "submit" otherwise it won't work.

14 Responses to "Two submit buttons send form to two different pages"

1 | Janos

December 24th, 2006 at 12:54 am

Avatar

This will break accessibility (on browsers without JS). My advice would be to let the user select the payment method before displaying the form and the display the appropriate form (PayPal or credit card) depending on his decision.

2 | Jennifer

December 24th, 2006 at 8:35 am

Avatar

That would mean making them select payment type before they even see a product… These buttons are on the product page. ie. They pick the product they want – on the product page they select how many they want – and then click a "buy now" type button… I wanted to reduce the number "steps" as much as possible, so a page after this asking them if they wanted to pay by credit card or paypal and then ANOTHER page (either paypal or the credit card payment info) wasn't something I wanted to do… If you have another way around it, I'm all ears…

3 | Jennifer Corban

December 27th, 2006 at 6:46 pm

Avatar

What about having 2 submit buttons, with different values. The action would be processpayment.php then in processpayment.php you figure out what the value of the submit button was and based on that you can redirect to paypal if necessary, or else process the credit card payment yourself.

4 | Jennifer

December 27th, 2006 at 7:35 pm

Avatar

Well, here's the thing, I'm not 100% sure, but I believe that Paypal needs that information sent to it as "POST" – and as far as I can tell, there's no way to submit POST header information WITHOUT submitting a form. Anything I've seen suggests sending it to a form that auto submits itself (with javascript)… which doesn't solve the problem of trying to create a form that doesn't need it. :)

5 | Jennifer Corban

December 28th, 2006 at 6:18 pm

Avatar

I haven't tried this, but I googled just out of curiosity to see if there was a way to 'fake' a post submission with php and found this which seems like it should do it.
http://www.zend.com/zend/spotlight/mimocsumissions.php?days=10000&f_id=mimocsumissions&mode=&kind=sl&article=mimocsumissions

6 | Jennifer

December 29th, 2006 at 9:47 am

Avatar

Interesting… I'll give that a whirl and see if it does the trick! :) (After I finish fighting with my shopping cart project. LOL) Thanks!

7 | Jennifer

December 29th, 2006 at 2:28 pm

Avatar

Was about to start playing around with this and noticed in the code – it won't FORWARD you to that page you need to submit the Post data to (in my case Paypal). Looked in the comments and found the same old story again:

"Well I searched all over the web and it is said that the problem is with html not allowing a redirect with post
vars.
The only solution I have found is to use javascript to post a dynamically generated form using
This works but requires the users browser to have javascript switched on.
Sigh."

8 | Jennifer

December 29th, 2006 at 2:48 pm

Avatar

Also -I saw the guy's comment after that one – but I have no idea what he's talking about. I tried his code exactly, and the best I get is forwarded to paypals main site – but not their shopping cart page like you would if you submited the form…

9 | Bakelite Gal

January 20th, 2008 at 6:02 am

Avatar

Does anyone have the full code for this I have tried it and I cant get it to work :-( Please help.

10 | ag3nt42

June 2nd, 2008 at 8:20 am

Avatar

I would use the same js functions only in php that way you don't need the users browsers to have JS enabled.. I came across this looking for…A way to have a form submitted to two different pages aswell.. however with my situation I need one submit to go to the same page as the form and the other submit to go to another one so serverside may not work for me. I will probably have to hack it. But what don't we have to hack these days. Def go with php solution for this.
I do not have time to write an example but if u use your brain you'll think of something.

11 | derringer83

October 6th, 2008 at 6:07 pm

Avatar

Its amazing how you posted this YEARS ago… but it still helped me instantly. Thankyou.

12 | arabicdreamer

July 7th, 2009 at 4:58 am

Avatar

Thanks a lot for this tip. IT is still helpful :) Thanks a lot

13 | aditya

November 12th, 2009 at 11:43 am

Avatar

Hi every one Following is the situation I want a solution for,

-I have a form whose contents are forwarded to a mailer program hosted on a server which sends out emails. So basically the form data is submitted to one Mailer page (I have no control over the mailer program).

-After the form has been submitted the mailer program redirects to a default page or the "return " page specified by me..again redirects no matter what I have no control over it…

-Now instead of being redirected to a page I want the form contents to be submitted to another php page which will appear after the form has been submitted to the mailer page and display the contents of the form originally submitted.

Basically I want to submit to 2 different pages I know thats possible but I do not know how to get around the redirection from mailer page.

I thought of having the second php page to be the redirect page with all form data sent in query string however data fields are too many to send over get.
Is there anyway around this in javascript?
Its very complex to explain..I hope some one can help

I hope following crude visualisation helps
currently

submit form to————->Mailer page (It redirects to any page specified)
form
to
|
|
|——->Page2.php (Want this to appear after form has been submitted to mailer page but mailer page redirects..)

Regards,
Aditya

14 | Bennett

December 30th, 2010 at 6:15 pm

Avatar

I would like to kiss everyone in this forum. I've spent the past 6 hours trying to figure out how to build a 15 page form with validation and page skips. This forum had the answers to my problem. Thank you everyone for your help!

Featured Sponsors

Genesis Framework for WordPress

Advertise Here


  • Scott: Just moved changed the site URL as WP's installed in a subfolder. Cookie clearance worked for me. Thanks!
  • Stephen Lareau: Hi great blog thanks. Just thought I would add that it helps to put target = like this:1-800-555-1212 and
  • Cord Blomquist: Jennifer, you may want to check out tp2wp.com, a new service my company just launched that converts TypePad and Movable Type export files into WordPre

About


Advertisements