What is JotForm?
JotForm is a free online form builder which helps you create online forms without writing a single line of code. No sign-up required.

At JotForm, we want to make sure that you’re getting the online form builder help that you need. Our friendly customer support team is available 24/7.

We believe that if one user has a question, there could be more users who may have the same question. This is why many of our support forum threads are public and available to be searched and viewed. If you’d like help immediately, feel free to search for a similar question, or submit your question or concern.

  • Profile Image

    Multiple payment option within the form

    Asked by beautifulcanvas on September 27, 2014 at 12:39 PM

    I am using the following script to load different forms when selecting from a dropdown box, I cant seem to figure out how to make the first option load automatically when navigating to the page with this script. hope this makes sense ?

    what I mean is the 1st option which loads a jpg file I need to be loaded without selecting from the dropbox when navigating to that page

    here is the script -:


     <div style="position:absolute; left:295px; top:260px;">
     <iframe name="dynamicLoad" width="655" height="2885" scrolling="yes"></iframe>
     <div style="position:absolute; left:0px; top:1220px;">
    <select class="form-dropdown" style="width:293px" id="input_1">
                <option value="Select your format type to load order form" onclick="parent.window.frames['dynamicLoad'].location = 'index_htm_files/order-default2.jpg'">Select your format type to load order form</option>
                <option value="Landscape or Portrait" onclick="parent.window.frames['dynamicLoad'].location = 'https://secure.jotformeu.com/form/23417681344353'">Landscape or Portrait</option>
                <option value="Square" onclick="parent.window.frames['dynamicLoad'].location = 'https://secure.jotformeu.com/form/23416770898365'">Square</option>
                <option value="Panoramic" onclick="parent.window.frames['dynamicLoad'].location = 'https://secure.jotformeu.com/form/23526927539363'">Panoramic</option>
                <option value="Split scene Landscape or Portrait" onclick="parent.window.frames['dynamicLoad'].location = 'https://secure.jotformpro.com/form/32384178356966'">Split scene Lanscape or Portrait</option>
                <option value="Split scene Square" onclick="parent.window.frames['dynamicLoad'].location = 'https://secure.jotformpro.com/form/32382871776970'">Split scene Square</option>
                <option value="Split scene Panoramic" onclick="parent.window.frames['dynamicLoad'].location = 'https://secure.jotformpro.com/form/32383339421957'">Split scene Panoramic</option>



  • Profile Image

    Answered by Mark on September 27, 2014 at 09:22 PM


    If I'm not mistaken, you want to create a multiple payment option within your form (main page), Correct? If so, can you please take a look at this Demo Form that I've created?


    Please follow this simple step:

    1. Create a new form as the main page

    2. Add iFrame embed widget

    3. Create Show/Hide conditional logic in your form. 

    Feel free to cloned the form and use it. If you need further assistance, please let us know.

  • Profile Image

    Answered by beautifulcanvas on October 04, 2014 at 10:02 PM

    Hi, thanks, this is what I need but I followed the above instructions but cant seem to get it to work ?

    i don't know what conditions to set after clicking next on "show/hide a form field", or what to do next to add 2nd 3rd 4th form etc, i may need more in depth details to make this work ?


    thanks for your help.

    (I'm using the cloned forms with "clone of paypal landport" form as default, all forms = width 1022px height = 1800px)

  • Profile Image
    JotForm Support

    Answered by ashwin_d on October 05, 2014 at 12:16 AM

    Hello beautifulcanvas,

    I did check your form "clone of paypal landport" and it seems you only have one payment question added. On what condition you want to show / hide this payment field? Do let us know and we will help you with conditions.

    You may also like to check the following guide on how to add multiple payment option in your form:  http://www.jotform.com/help/182-How-to-Create-a-Basic-Multiple-Payment-form 

    We will wait for your response.

    Thank you!

  • Profile Image

    Answered by beautifulcanvas on October 05, 2014 at 08:11 PM

    ok not sure if I'm making myself clear, not very good at this so here goes.

    I am using this code as my final form load setup -:

    <div style="position: absolute; left:250px; top:0px;">
     <iframe name="dynamicLoad" width="1025" height="1600" scrolling="no"></iframe>
     <div style="position:absolute; left:2px; top:450px;">
    <select class="form-dropdown" style="width:220px" id="input_1">
                <option value="Landscape or Portrait" onclick="parent.window.frames['dynamicLoad'].location = 'https://secure.jotformpro.com/form/42765910802960'">Landscape or Portrait</option>
                <option value="Panoramic" onclick="parent.window.frames['dynamicLoad'].location = 'https://secure.jotformpro.com/form/42765550155961'">Panoramic</option>
                <option value="Square" onclick="parent.window.frames['dynamicLoad'].location = 'https://secure.jotformpro.com/form/42765610088963'">Square</option>
                <option value="Landscape or portrait split scene" onclick="parent.window.frames['dynamicLoad'].location = 'https://secure.jotformpro.com/form/42765003167957'">Landscape or portrait split scene</option>
                <option value="Panoramic split scene" onclick="parent.window.frames['dynamicLoad'].location = 'https://secure.jotformpro.com/form/42717229635964'">Panoramic split scene</option>
                <option value="Square split scene" onclick="parent.window.frames['dynamicLoad'].location = 'https://secure.jotformpro.com/form/42764902955969'">Square split scene</option>


    this allows customers to choose the format they require and load the relevant form, this works just fine in I.E and firefox, but NOT in Chrome, opera or safari, I would settle for working in just I.E and chrome but I just cant get chrome working, am I missing something ?

  • Profile Image
    JotForm Support

    Answered by ashwin_d on October 05, 2014 at 11:33 PM

    Hello beautifulcanvas,

    It cannot work this way. You cannot fire the onClick even on the dropdown options. 

    I assume that you will not be using this code inside form. I am currently working your requirement and will send you the updated code in just a while.

    Thank you!

  • Profile Image

    Answered by Andrew Smith on October 06, 2014 at 09:28 AM

    Ok looking forward to the result. 

  • Profile Image

    Answered by beautifulcanvas on October 07, 2014 at 08:37 AM


    so I have cloned your demo form above and via the preview everything works just fine, form id https://secure.jotformpro.com/form/42786815248971 but when I insert to page (using Xara) there's a problem, if submit button is clicked without all required fields having been completed it shows error at bottom of form as expected but my entire page also shifts to the left and items or information on the page is missing ? it also happens when using just single forms ? not sure how to fix this?

    you can see what I mean using I.E http://beautifulcanvas.co.uk/order.htm even though this is using an iframe + dropbox it still shows the same problem if using the above form.


    UPDATE this only seems to be an issue with I.E, all seems to work ok with firefox, chrome, opera and safari