Payment Wizard: Separating the products from credit card & address

  • QEGI
    Asked on March 10, 2016 at 12:55 AM

    Attached screen cap makes this even clearer. My client is requesting the user fill out the credit card & billing address as the LAST part of the form. Currently the wizard does not allow separating these functions. Or perhaps there is in fact a way? Thank you.

    Jotform Thread 791543 Screenshot
  • Charlie
    Replied on March 10, 2016 at 3:10 AM

    Unfortunately, they cannot be split up, they are part of the payment integration. We can use CSS code to position it although I would not recommend it as it will most likely not give a properly layout.

    Another possible solution is to recreate your products using simple form fields like radio buttons AND past it on the payment total as a custom amount payment. Here's a quick step by step on what I meant:

    1. First, recreate the products by using a simple radio button field.

    Payment Wizard: Separating the products from credit card & address Image 1 Screenshot 70

    2. Now we want to assign calculation values on them, they will be the actual price of the product. To do this, right click on it and choose "Edit Properties".

    Payment Wizard: Separating the products from credit card & address Image 2 Screenshot 81

    3. In the "Properties" window, you can assign calculation value on the said options. Here's a guide to learn more about this: http://www.jotform.com/help/301-How-to-Assign-Calculation-Value 

    Payment Wizard: Separating the products from credit card & address Image 3 Screenshot 92

    4. Now I will setup a "Form Calculation" widget as a means to getting the price value on the radio button.

    Payment Wizard: Separating the products from credit card & address Image 4 Screenshot 103

    5. To get the value of the radio button field, we just need to click the "Add Field" button and find that specific field.

    Payment Wizard: Separating the products from credit card & address Image 5 Screenshot 114

     

    6. After that, we can now use the form calculation widget as a reference to get the total amount in the payment integration wizard, however, you'll need to select "Collect Donations/Custom Amount Payments" option and choose from the "Get Amount From" list. Here's a guide to learn more about this: http://www.jotform.com/help/275-How-to-pass-a-calculation-to-a-payment-field 

    Payment Wizard: Separating the products from credit card & address Image 6 Screenshot 125

     

    You now have a separate field for the products as a radio button and the payment wizard as the final total for the price. With this setup, you can simply create complex pricing and calculations before passing it in your payment wizard. Here's how it looks like: https://form.jotform.com/60691552823963 

    I hope that helps.

  • QEGI
    Replied on March 10, 2016 at 5:53 PM

    WOW thank you for the detailed response. I'm gonna wrap by brain around this and see if it works with our setup. THANK YOU VERY VERY MUCH.

  • Kevin Support Team Lead
    Replied on March 10, 2016 at 6:52 PM

    On behalf of my colleague, you're welcome. 

    Sure, do let us know if it works as you need, if it does not, we will be glad to help you.