Solved

Swap out code in action url when a radio button is clicked

Posted on 2014-07-23
7
361 Views
Last Modified: 2014-07-28
Hi everyone,

The following code is what my form action looks like:

<form name="catwebformform79383" method="post" onsubmit="return checkWholeForm79383(this)" enctype="multipart/form-data" action="https://site.worldsecuresystems.com/FormProcessv2.aspx?WebFormID=70464&amp;OID={tag_bookingid}&amp;OTYPE=61&amp;EID={module_eid}&amp;CID={module_cid}&amp;CC={module_urlcountrycode}&amp;Referrer={module_siteurl,true,true}&OPTIN=true&SendInvoice=true">

Open in new window


As you can see, I've added the following to the end of the action url:

&SendInvoice=true

This automatically sends an invoice once the form is submitted.

I have two radio buttons on my form, i.e. one for "Pay Offline", the other for "Credit Card". The code snippet showing these radio buttons is as follows:

 <td><label>Payment Method <span class="req">*</span></label><br />
                <p class="payOffline close-space"><input type="radio" name="PaymentMethodType" id="PaymentMethodType_3" value="3" /> Pay Offline</p>
                <div id="payOffline">
                <table style="margin: 0px; padding: 0px;">
                    <tbody>
                        <tr>
                            <td>
                            <p style="margin: 0px; padding: 0px;"> If you would like to pay offline, download this form and follow the instructions on the form to submit it back to us.
                            </p>
                            </td>
                        </tr>
                    </tbody>
                </table>
                </div>
                <p class="creditCard" style="margin: 0px; padding: 0px;"><input type="radio" name="PaymentMethodType" id="PaymentMethodType_1" value="1" /> Credit Card</p>
                <div id="creditCardType" style="margin: 0px; padding: 0px;">
                <table style="margin: 0px; padding: 0px;">
                    <tbody>

Open in new window


My question is, is there a way to use jQuery so that if someone clicks the radio with an id of "PaymentMethodType_3" then the action url would be revised so that it removed the following code from the end of the action url:

&SendInvoice=true

But then replaced it with:

&PageID=/Results.htm

So the revised form action would be as follows:

<form name="catwebformform79383" method="post" onsubmit="return checkWholeForm79383(this)" enctype="multipart/form-data" action="https://site.worldsecuresystems.com/FormProcessv2.aspx?WebFormID=70464&amp;OID={tag_bookingid}&amp;OTYPE=61&amp;EID={module_eid}&amp;CID={module_cid}&amp;CC={module_urlcountrycode}&amp;Referrer={module_siteurl,true,true}&OPTIN=true&PageID=/Results.htm">

Open in new window


If the radio button with an id of "PaymentMethodType_1" was clicked then the form code above would revert back to it's original state and vica versa.

I just wondered if anyone could help me out here?

Appreciate any assistance.
0
Comment
Question by:gwh2
  • 5
  • 2
7 Comments
 
LVL 32

Assisted Solution

by:Big Monty
Big Monty earned 500 total points
ID: 40214818
i would set the action when you go to submit the form, that way it's just one check:

in your checkWholeForm79383() function, do the check on the radio buttons:
function checkWholeForm79383( frm ) {
// pre-existing code

if( $("#PaymentMethodType_3").prop("checked", true) )
     frm.action = 'https://site.worldsecuresystems.com/FormProcessv2.aspx?WebFormID=70464&amp;OID={tag_bookingid}&amp;OTYPE=61&amp;EID={module_eid}&amp;CID={module_cid}&amp;CC={module_urlcountrycode}&amp;Referrer={module_siteurl,true,true}&OPTIN=true&PageID=/Results.htm';


}

Open in new window

0
 
LVL 1

Author Comment

by:gwh2
ID: 40215698
Thanks for the reply,

Could you check my code below to see if I inserted the if statement in the correct section of the function?

Really appreciate your help.

    <script type="text/javascript">
    //<![CDATA[
    var submitcount79383 = 0;

    function checkWholeForm79383(theForm) {
            var why = "";
            if (theForm.FirstName) why += isEmpty(theForm.FirstName.value, "First Name");
            if (theForm.LastName) why += isEmpty(theForm.LastName.value, "Last Name");
            if (theForm.EmailAddress) why += checkEmail(theForm.EmailAddress.value);
            if (theForm.BillingAddress) why += isEmpty(theForm.BillingAddress.value, "Billing Address");
            if (theForm.BillingCity) why += isEmpty(theForm.BillingCity.value, "Billing City");
            if (theForm.BillingState) why += isEmpty(theForm.BillingState.value, "Billing State");
            if (theForm.BillingZip) why += isEmpty(theForm.BillingZip.value, "");
            if (theForm.BillingCountry) why += checkDropdown(theForm.BillingCountry.value, "Billing Country");
            if (theForm.PaymentMethodType) why += checkSelected(theForm.PaymentMethodType, "Payment Method");
            if (!theForm.PaymentMethodType || getRadioSelected(theForm.PaymentMethodType) == 1) {
                if (theForm.CardName) why += isEmpty(theForm.CardName.value, "Name on Card");
                if (theForm.CardNumber) why += isNumeric(theForm.CardNumber.value, "Card Number");
                if (theForm.Amount) why += isCurrency(theForm.Amount.value, "Amount");
            }
            if (theForm.CaptchaV2) why += captchaIsInvalid(theForm, "Enter Word Verification in box below", "Please enter the correct Word Verification as seen in the image");
            if (why != "") {
                alert(why);
                return false;
            }
            if (submitcount79383 == 0) {
                submitcount79383++;
                theForm.submit();
                return false;

if( $("#PaymentMethodType_3").prop("checked", true) )
     frm.action = 'https://site.worldsecuresystems.com/FormProcessv2.aspx?WebFormID=70464&amp;OID={tag_bookingid}&amp;OTYPE=61&amp;EID={module_eid}&amp;CID={module_cid}&amp;CC={module_urlcountrycode}&amp;Referrer={module_siteurl,true,true}&OPTIN=true&PageID=/Results.htm';


            } else {
                alert("Form submission is in progress.");
                return false;
            }
        }
        //]]>
</script>

Open in new window

0
 
LVL 32

Expert Comment

by:Big Monty
ID: 40215704
it looks good, just change

frm.action

to

theForm.action
0
6 Surprising Benefits of Threat Intelligence

All sorts of threat intelligence is available on the web. Intelligence you can learn from, and use to anticipate and prepare for future attacks.

 
LVL 1

Author Comment

by:gwh2
ID: 40215742
Ok, I'll give it a try and report back. Thanks
0
 
LVL 1

Author Comment

by:gwh2
ID: 40215768
Hi,

I revised the code as shown below but when I tested, it seemed to ignore the if statement and so the url action wasn't changed.

Are you able to help further?

Thanks again

    <script type="text/javascript">
    //<![CDATA[
    var submitcount79383 = 0;

    function checkWholeForm79383(theForm) {
            var why = "";
            if (theForm.FirstName) why += isEmpty(theForm.FirstName.value, "First Name");
            if (theForm.LastName) why += isEmpty(theForm.LastName.value, "Last Name");
            if (theForm.EmailAddress) why += checkEmail(theForm.EmailAddress.value);
            if (theForm.BillingAddress) why += isEmpty(theForm.BillingAddress.value, "Billing Address");
            if (theForm.BillingCity) why += isEmpty(theForm.BillingCity.value, "Billing City");
            if (theForm.BillingState) why += isEmpty(theForm.BillingState.value, "Billing State");
            if (theForm.BillingZip) why += isEmpty(theForm.BillingZip.value, "");
            if (theForm.BillingCountry) why += checkDropdown(theForm.BillingCountry.value, "Billing Country");
            if (theForm.PaymentMethodType) why += checkSelected(theForm.PaymentMethodType, "Payment Method");
            if (!theForm.PaymentMethodType || getRadioSelected(theForm.PaymentMethodType) == 1) {
                if (theForm.CardName) why += isEmpty(theForm.CardName.value, "Name on Card");
                if (theForm.CardNumber) why += isNumeric(theForm.CardNumber.value, "Card Number");
                if (theForm.Amount) why += isCurrency(theForm.Amount.value, "Amount");
            }
            if (theForm.CaptchaV2) why += captchaIsInvalid(theForm, "Enter Word Verification in box below", "Please enter the correct Word Verification as seen in the image");
            if (why != "") {
                alert(why);
                return false;
            }
            if (submitcount79383 == 0) {
                submitcount79383++;
                theForm.submit();
                return false;
                
if( $("#PaymentMethodType_3").prop("checked", true) )
     theForm.action = 'https://stms.worldsecuresystems.com/FormProcessv2.aspx?WebFormID=70464&amp;OID={tag_bookingid}&amp;OTYPE=61&amp;EID={module_eid}&amp;CID={module_cid}&amp;CC={module_urlcountrycode}&amp;Referrer={module_siteurl,true,true}&OPTIN=true&PageID=/offline-results';

                
            } else {
                alert("Form submission is in progress.");
                return false;
            }
        }
        //]]>
</script>

Open in new window

0
 
LVL 1

Accepted Solution

by:
gwh2 earned 0 total points
ID: 40216016
Hi,

Just wanted to report back to say that I slightly revised the code so that it was positioned a bit further up in the code and just added some curly braces. The revised code is shown below so all is working well now.

Thanks for your help.

            if (submitcount79383 == 0) {
                submitcount79383++;
                
if( $("#PaymentMethodType_3").prop("checked", true) ){
    theForm.action = 'https://site.worldsecuresystems.com/FormProcessv2.aspx?WebFormID=70464&amp;OID={tag_bookingid}&amp;OTYPE=61&amp;EID={module_eid}&amp;CID={module_cid}&amp;CC={module_urlcountrycode}&amp;Referrer={module_siteurl,true,true}&OPTIN=true&PageID=/offline-results';}

                
                theForm.submit();
                return false;
                
            } else {
                alert("Form submission is in progress.");
                return false;
            }
        }
        //]]>
</script>

Open in new window

0
 
LVL 1

Author Closing Comment

by:gwh2
ID: 40223682
I had to revise the code given in order to find a complete solution
0

Featured Post

Do You Know the 4 Main Threat Actor Types?

Do you know the main threat actor types? Most attackers fall into one of four categories, each with their own favored tactics, techniques, and procedures.

Join & Write a Comment

Nothing in an HTTP request can be trusted, including HTTP headers and form data.  A form token is a tool that can be used to guard against request forgeries (CSRF).  This article shows an improved approach to form tokens, making it more difficult to…
This article discusses how to create an extensible mechanism for linked drop downs.
The viewer will learn the basics of jQuery, including how to invoke it on a web page. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery.: (CODE)
The viewer will learn the basics of jQuery including how to code hide show and toggles. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery…

759 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question

Need Help in Real-Time?

Connect with top rated Experts

22 Experts available now in Live!

Get 1:1 Help Now