-
joefer333Asked on July 10, 2017 at 6:00 AM
Hi all! I am planning to use popups as a substitute for hyperlinks. Is that possible? I was looking at this issue from a fellow JotForm user: https://www.jotform.com/answers/1128450-Pop-Up-Modal-Form-Elements/?entrymessage=10732640770
When he mentioned something bout a PDF pop-up, I thought this might be something I could substitute against the "webpage as pop-up idea". So I cloned the form to test BDAVID's solution. True enough, the PDF in his form ( https://form.jotform.co/71416509380859 ) works, but when I replace the link with a pdf from my Google Drive or Dropbox, the PDF doesn't show up.
As a summary, here are my questions:1. Is it possible to open up a webpage as a pop-up?
2. If #1 is not possible, then how do i seamlessly add a PDF (and preferably a jpeg, too) as a popup?
3. I almost forgot, it would be really helpful if I could do this with videos, too. I've not added that in the title as I fear it's something I'm asking too much. Feel free to skip this one if it's too much trouble :)PS: The form that our team is trying to make will have lots of hyperlinked texts in them. At the very least, I know how to use iframes and conditional showing/hiding of fields. Hyperlinking by opening new tabs is just so not aesthetically appealing for the form we have in mind :)
Thank you!
Page URL: https://form.jotform.me/71899004463462 -
Kevin Support Team LeadReplied on July 10, 2017 at 10:45 AM
It is possible to display any document or webpage using the solution given by my colleague BDavid, this due to the fact that the iFrame allows to display any content.
I have been testing and I can see a PDF file uploaded in Google Drive or Dropbox are not displaying; however, this is because the shared link is already their own PDF viewer. But, if you are using Google Drive you could get the file's link and replace the "view" parameter with "preview" like on the example provided on the other thread:
https://drive.google.com/file/d/0BzuPMowFlSBbRXJZWWNwYl80ZjA/preview
If you use this link then the file will be displayed, the same is with other files you upload to Google Drive. This guide will also help you to share a file: https://support.google.com/drive/answer/2494822?co=GENIE.Platform%3DDesktop&hl=en
While adding the iFrame, please also make sure to add the code between the <div> element:
Please, also make sure that the links you add are under the "HTTPS" protocol, otherwise the webpage will not be displayed. Here's an example about opening a webpage as modal: https://form.jotformpro.com/71904266358967#open
If you have any question, let us know.
-
joefer333Replied on July 11, 2017 at 1:47 AM
Worked liked a charm! Thanks Kevin!
I have to share an issue that might help other people who are trying the same thing using Google Drive. You NEED to actually test the link first on a browser first before you replace view with preview as this is what happens when you click "Get shareable link" and "Share...":But I have a follow-up question :)
I tried duplicating the pop-up field to test another document as pop-up. It didn't work. How do I do that? I'm a bummer when it comes to classes and id's,. please help! I also accidentally deleted the form so here's the new one for your reference: https://form.jotform.me/71909147263460 . -
Chriistian Jotform SupportReplied on July 11, 2017 at 3:59 AM
But I have a follow-up question :)
I tried duplicating the pop-up field to test another document as a pop-up. It didn't work. How do I do that? I'm a bummer when it comes to classes and id's, please help! I also accidentally deleted the form so here's the new one for your reference: https://form.jotform.me/71909147263460
I checked the form (https://form.jotform.me/71909147263460) you have provided and it seems that the other document you have tested as a pop-up is working now.
Are you still experiencing the issue on your end?
If you have other questions or concerns, please let us know.
Regards. -
joefer333Replied on July 11, 2017 at 4:10 AM
Hi Christian! Thanks for the prompt response. I was actually trying to display another doc on that 2nd pop-up button. Here's the screenshot of it:
If you try and clone that form, the 2nd pop-up actually has a different URL source. Here it is, by the way: https://drive.google.com/file/d/0B6mFMCvXEb-EbXhZVk00bTNHNFU/preview
-
CharlieReplied on July 11, 2017 at 5:33 AM
Hi,
I presume the problem is that the 2nd pop-up modal box is showing the same document embedded in the 1st modal, is that correct? This is because they are using the same ID. If you are referring to this guide: https://www.jotform.com/help/417-How-to-Add-a-Pop-Up-Modal-on-your-Form. This is actually the guide I made as a workaround for users looking for pop-up messages, however, it was designed for single instance only. To do it with two or more modal boxes, here's what you need to edit:
1. Here, I edited the 2nd pop-up modal element.
2. Now change the value of the href and id highlighted in yellow below. This will be the identifier for the modal. In this case, because this is the 2nd modal, I'll change them to open2. If you have more than two, then the naming should be open3, open4, and so on...
3. Save the changes and test your form. Here's a cloned form with the changes above: https://form.jotformpro.com/71912394078967.
Let us know if that works.
-
joefer333Replied on July 11, 2017 at 5:40 AM
You guys are lifesavers! Got nothing else to say but a big THANK YOU! Cheers!