Problems using window.print() method - javascript

I'm using window.print() method in JavaScript but I have the problems listed below:
Zooming in or out ruins page formation
Resizing the page does the same
I can't define end of each page
Do you know how to solve these problems?
I've tried disabling window resize but it didn't work.
Is it possible to use window.print() but the print dialogue wouldn't be shown and the pdf would be started to be downloaded?

I think you need a print stylesheet

Related

window.print() download pdf content cut between two pages How to fix

enter image description here
And Also I have issue this PDF run correct in chrome but in firefox dose not work like css and bootstrap not apply
I want PDF Like This
4 Div Print with Diffrent Content and when start new div page break content print another div.In firefox now work page break css how can i resolve issue?
We are use reactjs how can i solve this issue with correct PDF and shift content
PDF Correct Show in chrome but extra content in one page it will be cut that we don't want to this
PDF Correct Show in chrome but firefox page break not work
window.print() we are use
is there any another options
this PDF support of all browser

How to create a print dialog that displays the current web page's screenshot

I just want to know if there's easy way to create a print dialog for WordPress that outputs on the print dialogue box the actual view of a webpage. P perhaps a full page screenshot might work as long as it has the full page's height.
I tried WP-Screenshot plugin on this page. The plugin outputs a screenshot that can be printed out by adding a print dialogue plugin. However, the the height of the image produced by WP-Screenshot can't be dynamic so I guess I need to find another solution.
I can't find a plugin that has the functionality to print the current webpage with all the styles preserved in the print dialogue. So I'm thinking that screenshot might work.
Any idea or suggestions?
For printing the page and getting print dialog you can simply use window.print()
For better understanding please visit window.print()

Why browser displaying blank page when javascript turned off

I have build a website using MVC4, jQuery UI, Twitter Bootstrap etc using that template http://bit.ly/1aAcIJq
But the thing is, when Javascript is turned off the browser does not displaying anything, just blank page, however if I click view source so I can see the complete page source.
If you disable javascript and load http://bit.ly/1aAcIJq you will see what I mean
Is there any way to fix that?
After looking at your code, I found the problem. You have to change visibility: hidden to visibility: visible or just get rid of it. You will not have any of the flashy features and some of the functionality because JavaScript has been disabled, but it will display the website.

JavaScript: When printing a full web page, IE doesn't seem to print the contents of iFrames on the page

The client's website has product listings. The prices for the product are pulled dynamically in through an iFrame at the bottom of the page. There is Javascript on the page that automatically resizes this iFrame to the correct height based upon how big the iFrame content is, once it's loaded.
The client is reporting that when printing the page, they cannot see anything from the iFrame where the prices should be - apparently it is not printing in IE, just the main page itself.
I am on a Mac and so can't test in IE, so I'm having a hard time experimenting with this.
Can anyone clarify the expected behaviour in this situation? Is it possible to get IE to print both page and included iFrames by default, and if so, how would I go about doing this? I can only find examples for printing a specific frame from a parent window.
Thanks!
The expected behaviour should be what you're experiencing in other browsers. If the page is printed, the iframe should be printed along with it. It would be difficult to imagine that everyone else got it wrong and IE got it correct in this instance.
Below is a bit of speculation on what the issue might be, but without knowing more/seeing code it's difficult to know the specifics:
This issue could be due to some css that you may have on your page. I've read of similar iframe printing issues where the visibility was set to hidden initially resulting in the iframe not printing correctly. To get around this specific case the user had to set the width and height to 0px. Without knowing more about your site, I can not correctly predict that this is happening.
Another issue may by your dynamic resizing based on the contents of the iframe. A simple test would be to comment that section out and set a generic width and height on the iframe to see if the printing issue still occurs. Perhaps those dynamic styles are not being carried over to the print stylesheet and are not getting applied (therefore not appearing at all).
As a quick suggestion, look into css media types:
print
Intended for paged material and for documents viewed on screen in
print preview mode. Please consult the section on paged media for
information about formatting issues that are specific to paged media.
Helpful link: Print Specification
This was an interesting point, so I did a test using IE8 (on a server, not locally).
I printed in IE8 a web page that included an iframe of something that I built. And it printed some of the contents the first time (the other contents showed up black). The second time I printed, the iframe contents were all black.
However, in my example, the contents in the iframe are changing constantly (images and text that fade in and out) and the css background behind it is black.
This test has the contents of the iFrame on a different host server than the contents of the main page. But to my knowledge, there is a cross-domain policy file working here.
Cross-domain policy issues were my first guess, but it's entirely possible there is some issue with how internet explorer renders the screenshot when it sends it to the printer.
If you are using Javascript, then why not try window.print() function along with print media CSS.
I can't explain why IE isn't working, but maybe you can fix the problem by adding this part of code into the parent page, in order to force each iframe to be refresh :
$(document).ready(function() {
if($.browser.msie) {//Only for IE
$('iframe').each(function() {
$(this).attr('src', $(this).attr('src'));
});
}
});
To get the browser, i use this method.
And i don't use contentDocument.location.reload(true); method to be sure the iframe to be refresh. See SO topic.
Try this Plugin it will solved your problem
http://projects.erikzaadi.com/jQueryPlugins/jQuery.printElement/

Javascript HTML Window Print Issue

I am using window.print() Javascript function for my HTML page to print, but it inclues Page URL and date in footer by default into the print or print preview.
Any quick solution, might be some patch in JS or something?
You can't remove the headers/footers programmatically. Visit this link or this SO question

Categories