Print PDF directly from url
To display the file in the same tab of the browser you can use:
window.open(url, "_self");
Or also you can try:
window.location.assign(url);
If by printing you mean in a printer you can use http://printjs.crabbly.com/
How to print pdf.js document?
Try using the javascript-function window.print();
, which opens the print-dialog.
You will have to add an button to your html, which triggers the command - its not possible within the pdf.
For this reason, you will need an iFrame, and use something like this:
function printIt() {
var wnd = window.open('http://your-pdf-url');
wnd.print();
}
<input type="button" value="Print" onclick=printIt()>
window.print()
wouldn't work, because it would also print the surrounding html.
EDIT:
From your comment, I now know, that you want to print the content of a canvas-element - which is much easier.
You don't need an iframe, you can put the button on the same page, and use window.print();
.
In order to only print the canvas-element, and to hide the surroundings (like the button), you can use css-Syntax like this:
@media print
{
.no-print, .no-print *
{
display: none !important;
}
}
@media print
specifies css-code, which only applies for a webpage, if it gets printed. If you now asign the class .no-print
to everything except the canvas-element, only your pdf will be printed.
You can also use this css-code, if it's easier:
@media print
{
*
{
display: none;
}
canvas
{
display: inline;
}
}
Related Topics
Javascript: Replace Last Occurrence of Text in a String
How to Change Value of Object Which Is Inside an Array Using JavaScript or Jquery
How to Output a Variable from JavaScript to HTML
Onclick JavaScript to Make Browser Go Back to Previous Page
Require(Img Path) Not Working/ Cannot Find Module "." Reactjs
Generate Pdf from HTML in Div Using JavaScript
How to Output Date in JavaScript in Iso 8601 Without Milliseconds and With Z
How to Protect HTML Form from Blank Submission
Html Input Type Number Thousand Separator
Bootstrap 4 Dropdown Menu Not Working
Get List of Filenames in Folder With JavaScript
Wait for Asynchronous Functions to Finish in Angular
Check If Json Response Data Is Empty
How to Display an Iframe on Button Click
How to Get Date Value from One Date Input Field and Put It to Other Date Field Using JavaScript
Creating a Leaderboard in Html/Js
How to Add a New Object (Key-Value Pair) to an Array in JavaScript
Json Object Array Inside Array Find and Replace in JavaScript