One form - 3 buttons

[alex4orly]

Can I have a page with a form, but the form has 3 option buttons, like here
https://communitylifestyleaccommodation ... money.html
Each of the buttons needs to perform two jobs:

1) Send an email to a nominated email address to pass on the details of the input items and Which button was selected
2) Load up a Payment / Credit card page

Suggestions please

Thanks

[Pablo]

An HTML form can only have one action field.
So, to implement this functionality you will have to dynamically change the 'Action' property via JavaScript.

[alex4orly]

You mean, something like this:

<SCRIPT>
function submitFunction(i) {
if (i==1) document.theForm.action=
"http://www.company.com/cgi-bin/cgi1.cgi";
if (i==2) document.theForm.action=
"http://www.company.com/cgi-bin/cgi2.cgi";
if (i==3) document.theForm.action=
"http://www.company.com/cgi-bin/cgi3.cgi";
document.theForm.submit()
}
</SCRIPT>

<FORM NAME="theForm">
<INPUT TYPE="button" VALUE="Submit 1" onClick="submitFunction(1)">
<INPUT TYPE="button" VALUE="Submit 2" onClick="submitFunction(2)">
<INPUT TYPE="button" VALUE="Submit 3" onClick="submitFunction(3)">
</FORM>

[Pablo]

Yes, that is what I meant.

Note that if you use the built-in form script then you can duplicate the page, each with a different email address in the form and use those pages for the actions.

[alex4orly]

Sorry, how do I dupliacte the page?
The entry point is here : https://communitylifestyleaccommodation ... money.html
This is the only FORM, so how do I duplicate?

Thanks

[Pablo]

You can clone the page in the Site Manager.

[alex4orly]

YEs, I do clone pages - but I have ONE single entry point - which is that link I provided
What do I clone? The form is part built in that entry page
????

[Pablo]

- clone the page
- change the email address on the form for each cloned page.
- use the script to change the action of the main form and set it to the other pages.
(note that this is just a suggestion)

[alex4orly]

Once again, it seems a missunderstanding.

The page has three buttons and a form.
If I clone it, the cloned page will also have 3 buttons and a form, so will the 3rd one

So, I am confused - which page should I clone?

Sorry?

[WWBman]

As another option:
Perhaps you could use another of Pablo's suggestions in this post?
More than one form is used (in your case 2 more) and the values from the first form are copied to the appropriate form.
viewtopic.php?f=5&t=83570

[Pablo]

Once again, it seems a missunderstanding.

I don't think so....

The idea is to have 3 forms on different pages with different email addresses.
The 2 extra pages are only needed to process the form, the layout is not important.

The 3 buttons control the action (destination page) of the first form.

[alex4orly]

So, how does the main page with the 3 buttons work?
Which of the 3 buttons is the Submit button
Each of the buttons is loading a different page - the Membership one is the first one I implemented
Each of the 3 buttons will :
1) Send an email with the details, in all 3 cases the email is sent to the same person - the Treasurer
2) Each button will load a DIFFERENT page

Thanks

[Pablo]

The buttons are used to change the action of the form and trigger the form submission.
See your own reply (submitFunction)

[alex4orly]

So, I am not clear - Can any of the 3 buttons become the submit and just call another page?
How?
Please explain
Thanks

[BaconFries]

So, I am not clear - Can any of the 3 buttons become the submit and just call another page?
How? Please explain

Maybe the original author or page will be able to explain as this looks identical to what you are trying to use.
https://www.rgagnon.com/jsdetails/js-0018.html

[alex4orly]

Thanks Baconfries,

If you look up at the top, I have already found this
Ayyway, thanks again

[BaconFries]

Yes I know, my suggestion was if you require help on how to use then contact the original author of the script at the page....
https://www.rgagnon.com/jsdetails/js-0018.html

[alex4orly]

Thanks, I didn't try it yet - I have more problems with my other topic
How to make a Dialog to be Modal....

I tried everything, maybe you can help me with it here

https://www.wysiwygwebbuilder.com/forum ... 07#p424107

Cheers

[Pablo]

So, I am not clear - Can any of the 3 buttons become the submit and just call another page?

Yes! By using the script you suggested yourself.

Step 1
add 2 extra pages, so you have a total of forms with different email addresses. Those pages will be the destination pages for form action you are going to control via the script.

Step 2
Modify the 'submitFunction' script so the click of each button will modify the action of the form (and submit it)

[alex4orly]

I implemented the following code (ignoring the submit of the email for now)

<script type="text/javascript">
function submitFunction(i)
{
if (i==1)
{
// This next call, loads the page into the whole browser screen, NOT a popup dialog
window.location = "https://communitylifestyleaccommodation ... rship.html"

// This call, loads it as a dialog popup - BUT it is NOT Modal - can't find in WWB properties where to set that to be a Modal page
var myWindow = window.open("https://communitylifestyleaccommodation ... rship.html", "", "width=800,height=650");

}
if (i==2)
{
window.location = "";
}
if (i==3)
{
window.location = "";
}
//document.theForm.submit();
}
</script>

[Pablo]

Sorry, but this is not correct.
You will need to change the action property of the form, like in the original script.

This is what you wrote:

Code: Select all

<SCRIPT>
function submitFunction(i) {
if (i==1) document.theForm.action=
"http://www.company.com/cgi-bin/cgi1.cgi";
if (i==2) document.theForm.action=
"http://www.company.com/cgi-bin/cgi2.cgi";
if (i==3) document.theForm.action=
"http://www.company.com/cgi-bin/cgi3.cgi";
document.theForm.submit()
}
</SCRIPT>

<FORM NAME="theForm">
<INPUT TYPE="button" VALUE="Submit 1" onClick="submitFunction(1)">
<INPUT TYPE="button" VALUE="Submit 2" onClick="submitFunction(2)">
<INPUT TYPE="button" VALUE="Submit 3" onClick="submitFunction(3)">
</FORM>

It looked like you understood me after my first reply and now you are going into a complete different direction!
Please stick the original idea.

[alex4orly]

OK, When I cahneg it back to the original, my code looks like the below segment - But, when I click the button "Membership" nothing happens. I placed an alert() inside the if(i==1) and it shows up when I click the button

<script type="text/javascript">
function submitFunction(i)
{
if (i==1)
{
document.theForm.action="https://communitylifestyleaccommodation ... rship.html";
}
if (i==2)
{
document.theForm.action= "";
}
if (i==3)
{
document.theForm.action= "";
}
document.theForm.submit();
}
</script>

[Pablo]

There is an error in the script:

Code: Select all

alert(Hello dialog);

should be:

Code: Select all

alert('Hello dialog');

Also the form pages should be PHP.

[WWBman]

Here is a sample of what's required (I think!).
I thought you might prefer 3 payment pages, if not just delete 2 and 3 and adjust the success page entries.

http://www.mediafire.com/file/abqb3odk1 ... m.wbs/file

EDIT:
I tested it on a local server so you might need to change the URLs in submitFunction function.

[alex4orly]

Hello WWBman

In the meantime, I got more details from the Payment Gateway people
At the end of processing the money transaction. the Gateway sends an email with all the details to a nomiated email address, so in fact I do NOT need to process any form at my end.

Therefore the Welcome page with the 3 buttons doesn't need any special thing, each of the 3 buttons is calling a different WWB Object with a specific description of Membership, Donations, Raffle tickets.

My only remaining problem at the momemnt is that as it stands now, when the transaction is done, the visitor is left on a blank screen... This is of course wrong and I am looking for a way to get back to the front screen of the website

Thanks