scholzr
scholzr

Reputation: 245

open pdf in iphone webapp

I am trying to open a pdf from my JQM webapp. I have tried iframes/embed/object, and none of those work on an iphone like they do on a desktop browser (scrolling, zooming, etc). I have settled with simply opening the pdf via a link <a href="mypdf.pdf">Link</a>. This works fine in the standard browser because the user can simply use the browser back button to navigate back to my app.

The issue that I am having, is that when a user saves the page to thier home screen and opens it using the chromeless safari browser, they no longer have the browser back button. I have tried adding target="_blank" to the link, but apparently JQM hijacks the link and prevents opening in a new page, and I have been unable to get the hacks to work.

I have also tried pdf.js, but I can't seem to even get that to work as my javascript knowledge is fairly limited, and the examples are pretty advanced. The only tutorial that I found used an old version which I couldn't get to work.

Are there any ways to bypass the JQM in openning a link in a new window (which would in turn open in the mobile safari rather than my chromeless web app), or are there any other suggestions for how to open a pdf from a webapp?

Upvotes: 1

Views: 8967

Answers (3)

FrankFan
FrankFan

Reputation: 57

I met the same question: open pdf in webapp with html5.

I've tried several solutions: iframe、embed、pdf.js, but none of them is the best solution.

tips: iOS 9.x upper, open pdf with iframe only show the first page of the pdf file, and there will be a <img /> tag in the iframe body when you debug.

util now I still have this troublesome problem, anyone has solution please write your experience here.

Thank you.

Upvotes: 0

grigno
grigno

Reputation: 3198

For my webApps I used https://docs.google.com/viewer to embed the pdf into my interface. So, when I navigate the webApp by home screen icon, the app doesn't close when I open the pdf.

Upvotes: 0

Ryan
Ryan

Reputation: 28187

Just disable the default jQuery Mobile behaviour, by specifying data-ajax=false.

For example:

<a href="somefile.pdf" data-ajax="false">Link</a>

See http://jquerymobile.com/demos/1.2.0/docs/pages/page-links.html

Upvotes: 5

Related Questions