View PDF on button click

In desperate need of help!!! I’m hoping the solution for my quandary will be simple enough. Basically, when users click a button in my app I need a popup to appear showing a PDF that was previously uploaded. So I either need to find out how to display the PDF inside a group/popup or a way bubble can natively handle PDFs, just get it to show up. Thanks in advance for any and all help.

1 Like

Hi @binzoh.local :slight_smile: You can use an HTML element which uses Google’s Document viewer with this code (starting with < and ending with >):

iframe width=“100%” height=“95%” frameborder=“0” src=“https://docs.google.com/gview?url=http:Thing’sFileField’sURL&embedded=true”></iframe

I’ve only used this solution in a new page that is opened using a link element, but perhaps it would work in a popup?

6 Likes

Hi @fayewatson, I’m working on something similar and just wondering where your file is saved in the “Thing’sFileField’sURL” field? My file link is a bitly URL which is entered as a text type field called “Application” in my “Apartments” database and it doesn’t seem to be working when I try it with an iframe. Does it have to be saved in Google somewhere instead?

Any help is appreciated!

Hey JP! It looks like that is correct - the only last part of that dynamic expression needed is “'sURL”. So the entire expression would be “Parentgroup’sApartment’sApplication’sURL”. If you click on “Application”, a “more” button should appear and then select 's URL. That should do it! :slight_smile:

Hey @fayewatson, for some reason “'s URL” is not an option when I click the “More” button. “Formatted as” is an option, so I tried that and format type as URL encoded but that still didn’t work. I also tried formatting the url in my database to include “www” but that didn’t help either. Any ideas on why URL is not popping up as an option?

Thanks!

Ohhh right, because that field is type text (as you said).

It looks like a link will automatically open the PDF in a new tab (instead of downloading it). Try placing a link element over the file icon (without any text). Then set the link to open an external URL in a new tab, with the destination being the field where the link URL is stored. This might automatically open the file in a PDF viewer (I just tested and it did in my app).

If this doesn’t happen, or you want to use the iFrame so the file is viewed within your app - can you change the URL’s field type from text to file? I believe it will still allow you to store the URL (even if you’re not using the file uploader). Then the URL option should become an option! :slight_smile:

@fayewatson Ya so my app currently does open the PDF in a new tab but it’s also opening a third party site where the pdf is stored. How did you get yours to open up in a pdf viewer? Ideally it would be great if the file just downloaded or opened within my app via iFrame when clicked.

I also tried changing the URL field type to “file” from “text” and did see the URL option. However, that still didn’t work. Now I’m wondering if it has something to do with the fact that my pdf is stored on an external site?

What’s an example URL of one of the pdfs? (Can PM me this if you prefer)

Hi @fayewatson, just PM’d you!

I’m trying to do this.
I know this post is old but hoping you can help.
I have an asset that is uploaded (a pdf file) I need to open the pdf file in a popup with an iframe or something like that because my app is on a tablet and I don’t want to open a web browser. An example would really help. Thank you in advance.

Hi @mikebhobbs :slight_smile: This is an older post but I believe using either the Google file viewer or the Office file viewer iframe methods should do the trick! Here is @vincent56’s post on this: Preview of a File/document saved in Amazon s3?

4 Likes

LOL I was just on another thread - someone said they LOOK for your name when they are trying to solve an issue and now on 2/2 threads today YOU’RE THE ONE. Bravo and thank you for all you do.

1 Like