Hey guys I have searched a lot but didnt get any working solution for this problem.
I am working on a site using jsp and on this we have to upload forms in doc / docx/ pdf format. I want to generate the preview of the first page of the form. So that user can checkout whats in the form before downloading it.
Hope someone will come up with some solution for this.
Thanks
Not sure what OS platform you are on for your jsp, but my recommendation would be to have a virtual printer driver that can "print" the document at hand to an image file (or as HTML). Then you can manipulate the output of the printer driver anyway you want. Extends itself nicely to other file formats as well.
Another version of this technique would be to programatically open the document with Microsoft Word (using ole automation), then do a screen capture after the document opens. Word can load PDF files as well. You'll have to find a creative way to get the document into a Windows desktop process from your server. But it could work.
Well.. what you can do is..
Hyperlink the form names with relative paths of your jsp with download option. You need to write a servlet to download the form.. preview this jsp in pop up window.
or
use iframes in html create a div tag to preview and download the same form you are displaying. You need to write a servlet to download the form.
Make sure you set the appropriate contentType of your forms doc/pdf/jsp using response.contentType("image/jpg");
response.contentType("application/pdf");
response.contentType("application/doc");
Related
I have zero knowledge with regard to coding. I desperately need to download a pdf file which is being shown in the fashion attached to this post. The download button is not working and I've tried everything which I can to download the file. Any help is welcome. Things which I've tried are
Finding file source in network tab under inspect element
Finding any URl leading to the pdf again in the inspect elements tab.
Saving the page as Html, upon which it downloads but never opens again with the pdf required.
Also in my limited research which I could make sense of was, the page used canvas element to render the pdf. Text of pdf is seen to be entered manually in a separate layer.
The address of the pdf being rendered is actually visible in the url on your image.
the ../../ means go up 2 directories.
So that means the absolute url for your pdf is this.
https://www.time4education.com/MoodlePages/catmttt/cat20materialvideos/VAHO1002103.pdf
I have an internal site with lots of different pages, all of them has a printable version controlled by CSS only. My users create PDFs using Chrome's Print/Save As PDF menu command. I wonder if it would be possible to use JavaScript to initiate Save As PDF from a button and automatically open the saved PDF (actually saving is not important, just viewing it on a new tab is fine).
Chrome-only solution is OK. It's also not a problem if a Chrome extension needs to be installed. Anything is fine as long as I don't have to write extra PDF rendering code for each page layout.
There is no way to force a browser to print something as a PDF, or even send a request to a printer, the best method you can do it use the print() function in JavaScript.
A way you can do this is to make it an iframe object and print it like this:
document.getElementById('content-frame').contentWindow.window.print();
That would make it send a print menu for the iFrame, printing only the content within the iFrame.
The html embed tag displays PDFs with print and download options. Depending on the setup of the page, you could append an element somewhere with the pdf source dynamically populated from a button users see beside the PDF's name.
For Example...
HTML:
<div class="parent-container">
<h3 class="pdf-name">Some PDF Name</h3><button type="button" class="open-pdf"
data-pdf="source">Open</button>
</div>
Javascript:
function displayEmbeddedPdf (event){
event.preventDefault();
let pdfSource = $(this).data("pdf");
let pdfDisplay=`<embed class="embed-responsive-item embedded-pdf"
src="https://via.placeholder.com/150#view=FitH">`
$(this).parent().append(pdfDisplay);
}
$( document ).ready(function() {
$(".open-pdf").click(displayEmbeddedPdf)
});
I've used an image placeholder in the space below, but you could instead
insert the pdfSource variable to access a source in your directory ... Also
note that the "embed-responsive-item" class on the embed tag is from with
Twitter Bootstrap and helps with the responsive formatting. Also, "#view=FitH" is an open parameter. Here's more info about open parameters: https://www.adobe.com/content/dam/acom/en/devnet/acrobat/pdfs/PDFOpenParams.pdf
See the code on this CodePen: https://codepen.io/gemiller/pen/qvyaGZ
Here's an example of what an embedded pdf looks like: https://msu.edu/~urban/sme865/resources/embedded_pdf.html
I'm currently working on a Phonegap App, previously developed by another programmer.
Right now he's using the ChildBrowser plugin to display pdf documents.
Now we want to / have do display the pdf files next to another sidebar, which is why I need the pdf inside of another div instead of ChildBrowser's new window.
I tried on using pdf.js, pdfobject.js witch no success. Embedding the PDF in the html object tag worked, but I could not scroll it. Are there any hints out there I might have missed?
I think this post will solve your problem.
Open pdf using phone gap
It explains how you use child browser plugin to view pdf file but you need use child browser to Android and other to iOS.
Consider using pds.js to render PDF in HTML5: https://github.com/mozilla/pdf.js
Alternatively, embed pdf as iframe or object: PhoneGap Inline PDF
Is there a easy way to view a word or pdf document in my webpage? I searched In google, but didn't find what i need...
I want it to load word or pdf document from link, and show the content of that document In the webpage.
If the documents are not confidential, and you don't mind uploading it to a publicly avaliable website, you could embed the reader from scribd .
They also have an API, which might allow you to restrict who can view your documents.
If you want to open pdf file from link in HTML than this code may help you:
<a href=\"NAME OF FILE.pdf\" title=>NAME OF LINK AS YOU WANT IT TO APPEAR>Click Here</a>
this link open your pdf file in the current web page.
For further information on this topic
-> Click here
I want a frame with a PDF document. The main document will use javascript to tell the PDF document what page to display and zoom level. Can this be done? If so, how or could you point me to documentation on it. Thanks.
You can't/shouldn't do it in a frame, but you can create an <object> on your page that is controllable using the JavaScript API.
http://www.adobe.com/content/dam/Adobe/en/devnet/acrobat/pdfs/js_api_reference.pdf
Not easily. It all depends on what's being used to display the PDF in the browser. Not all browsers have built-in PDF viewers, and then there's many different external viewers (e.g. Acrobat, Fox-It, etc...) as well. As far as I know, there's
You can try hacking up the URL like this:
http://example.com/somedocument.pdf#page=5
but this may work in Acrobat only, as documented here: http://partners.adobe.com/public/developer/en/acrobat/PDFOpenParameters.pdf
Do you need a PDF reader to be loaded and running? If not, you could write a back end script/program to render a specified page as an image (GIF, PNG, etc.) at a particular zoom level. Then your main page could load an image with something like:
<img src="render_pdf?page=4&zoom=150">
The src value could be controlled with javascript to make it dynamic.
To convert from PDF to an image in your render_pdf script, you can use ghostscript, or an image specific library like ImageMagick or GD, depending on what backend technology you are using.
Have a look at jsPDF - it may not output a .pdf onscreen in IE6 and IE7 due to limitations with datauri's, but its a good start. I dont see why this couldnt be built up in an iframe either.
As Jordan pointed out, you should use the <object> tag to embed the PDF. Then, in the PDF itself, you need to embed Javascript to handle the messages you pass in, such as:
if(!this.hostContainer.messageHandler) this.hostContainer.messageHandler = new Object();
this.hostContainer.messageHandler.onMessage = handleMessage;
function handleMessage(msg) {
// do stuff here
}
Finally, in your HTML JS, you pass messages in with:
document.getElementById('yourpdfobject').postMessage('some message or array');