How can I create a pop up box in a form?

  • Profile Image
    Deborah.Miller
    Asked on February 12, 2016 at 07:34 PM

    On form https://form.jotform.com/60427860250956, I would like to embed a link to another form they can use to help select a job code, https://form.jotform.com/60425205671954, similar to the picture. When they click, the other form pops up. (This is for a much larger and more complex form that we can't just build logic into at this point, testing the feasibility with this one.)

     

  • Profile Image
    Nik_C
    Answered on February 13, 2016 at 10:43 AM

    Hello there, 

    You can add your form to pop up inside your code of the webpage by doing this:

    You log in to JotForm form builder, for the form that you want to pop up, and you go Publish:

    Than you choose Embed, and Pop-up option:

    This code you can copy inside your HTML code, you can check how it looks like here:

    https://jsfiddle.net/nw2c8wbg/

    The other way around, not a pop-up, but as a new winow, is you can make this: 'Click to view a tool to select a student/GSRA job code'  as a link and than if you need to go back to the first form you just change the thank you page to go back to first form.

    Please let me know if you have any additional question.

     

    Best regards,

     

  • Profile Image
    Deborah.Miller
    Answered on February 16, 2016 at 03:33 PM

    Hi and thank you! I did try as you mention but for some reason it is not enabled in the external version of the form.

     

    I am able to use the link method with the target of a new window, however it opens as full size so it's pretty big real estate and requires toggling back and forth. If that's the only way it can work I guess that's ok, just hoped I could do a pop up.

  • Profile Image
    Nik_C
    Answered on February 16, 2016 at 06:56 PM

    Hello there,

    Unfortunately it is not possible to do a pop up that way, directly, since you are embedding from JavaScript. What you could do possible is to embed that JavaScript code in your code of your website.

    To do this, you have to download the whole source code of JotForm form and than inject the code for pop up. You can do that by following:

    1. You log in to your JotForm form builder, and than go Publish:

    2. On new screen follow this steps:

    3. When you download your source code you can open that html page and edit in any editor:

    4. Inside of that html you can input the code of the pop-up:

     <a target="_blank" href="javascript:void( window.open( 'https://form.jotform.com/60425205671954', 'blank', 'scrollbars=yes, toolbar=no, width=700, height=500' ) ) ">Click here to view a tool to select a student/GSRA job code </a>

    That code you can copy between two div tags like I did here:

    First arrow is that pop up code between two div tags, and second is a submit button, I just wanted to show you that I put that between the text-box and button, you just save that and it looks like this:

    So the link is there and when you click on it it pops up like on the screenshot.

    I hope that that is what you wanted, now you should know that after that all edits will be on the source code of the page, but I guess that you are already familiar with that.

    Please let me know if that works for you.

    Best regards.

     

  • Profile Image
    Deborah.Miller
    Answered on February 16, 2016 at 07:20 PM

    I will give it a shot, thanks.

  • Profile Image
    Nik_C
    Answered on February 16, 2016 at 07:22 PM

    Ok,

    please let me know how that worked and if I can help you somehow.

    Best regards.