Issue in printing iFrame in Google Chrome - javascript

I have an iframe like
<iframe id="Frame1" name="Frame1" style="width: 810px;overflow:hidden;height:525px;border:none;"src="templates/template1.html">
</iframe>
When I click generate button
the generate function will call.In generate function i changed the src of the iframe to template2.html.
<input type="button" id="btngenerate" onclick="Generate();"/>
<a id="print" onclick="OnPrint();">Print</a>
When I click on the print link after clicking the generate button,I want to print the iframe.
function generate()
{
var billPath = "templates/template2.html";
$("#Frame1").attr("src", billPath);
}
function onPrint()
{
window.frames["Frame1"].window.focus();
window.frames["Frame1"].window.print();
}
It works in Firefox. But not in chrome.
In chrome the template1.html will be printed.I want to print template2.html.
When I call window.print(); it will print the whole page.
Please help me...

Is it possible for you to use a separate window to print your content (like I described here https://stackoverflow.com/a/23281929/701869) ?

Related

Close or hide iframe

This is my iframe, it is a google form, which means I cannot edit that.I need this iframe to close or hide by any means i.e., a button, a popup window button or maybe without any button.
$gLink is a google form Link, carried by a php sesssion variable.
<iframe name="target" id="target" width="320" height="187" frameborder="0" src="<?php echo
htmlspecialchars($gLink); ?>"></iframe>
I had tried this, but it did not work.
var iframe=document.getElementById("target");
iframe.parent.removeChild(iframe);
This is another code I tried, which also did not work.
<script>
function myFunction{
var closeIFrame= function(event)
{
if (!event || event.data != "FeedbackWidgetClose")
return;
fifToggle();
}
window.addEventListener("message", closeIFrame, false);
}
</script>
<button onclick="myFunction()">Click me</button>
There is no parent. You should use parentElement:
iframe.parentElement.removeChild(iframe);
A tip for future debugging: open up the web console in your browser so you can detect any errors that occur as your interacting with your page.
Also, your function myFunction should be defined like this (its missing the brackets):
function myFunction() {

Changing an iframe SRC dynamically

What I have and I need to do it work properly is when I'm in a "start page" and I click a button like this:
PAGE-1
Point A
It should send me to "another page" where I load dinamically an iframe taking each variable (shopID, type, max-levels and point) from the URL and print it like an iframe this way:
PAGE-2
<iframe id="frame" src="http://myappwebsite/resourcesiframe?shopId=3366&type=image&point=A" width=“XXX" height=“XXX"></iframe>
I've used this javascript snippet but anyway, I can't make it work properly at all.
$(".map-button").click(function (e) {
e.preventDefault();
$("#frame").attr("src", $(this).attr('data - iframe - src'));
});
I only need to get the variables from the data-iframe-src and use them in the iframe, but I'm not able... The problem is that I load elements in different pages, so I don't know how this affect to the URL variables.
I've founded a simple solution for my problem here and it works for me.
First of all I put this simple iframe in my PAGE-2:
<iframe id="frame" src="" width="100%" height="auto" frameborder="0" scrolling="yes"></iframe>
Then in PAGE-1 I've used this type of links:
https://myappwebsite/page-2?shopId=1234&type=image&max-levels=1&point=A
So now my PAGE-2 loads properly with these params in the URL. Then I've used this simple snippet in Javascript to fill my iframe in PAGE-2:
<script type="text/javascript">
$( document ).ready(function() {
$("#frame").attr("src", "https://myappwebsite/resourcesiframe" + window.location.search);
});
</script>
And it works! Now I can go to PAGE-2 with all my params, pick them and use them in SRC inside the blank iframe.
Thanks for getting me in the correct path!

Print a pdf with javascript or jquery

I need to print a .pdf file (I generate it with jasperReport and I save it on a server) when I click on a print.gif button.
Now I found this solution that works for Firefox but not for IE!
function printPdf(){
var url= document.getElementById('_url').value;
newwindow=window.open();
newdocument=newwindow.document;
newdocument.write('<embed type="application/pdf" src="'+url+'"
id="pdfDocument" height="100%" width="100%" ></embed> <SCR'+'IPT
LANGUAGE="JavaScript">window.print();window.close();</SCR'+'IPT>');
}
I tried also document.close(); window.focus(); window.print(); window.close();, but they didn't work!
I read a lot of topics, but I can't find a solution for this issue!
Create a iframe in html:
<iframe id="pdf-iframe">
Then change the src of that iframe and on load, print it.
$('#pdf-iframe').attr("src", pdf_url).load(function(){
document.getElementById('pdf-iframe').contentWindow.print();
});
I believe the Problem is that the content is not loaded yet?
I had the same issue in IE8. I had to save the document, reopen it, print, and close the window again.

Printing the IFrame document in IE9

I have a Iframe and I am Displaying the PDF inside the Iframe , Now i have to print the Iframe
Document on clicking the Print Button , Its Working fine with Crome , but not working with IE9
frames[0].focus();
frames[0].print();
I am using this code on javascript on button click , its working with Crome but not IE9.
This is Iframe tag:
<iframe id="myIframe" name= "tabsa" runat="server" src="PDFFilePage.aspx" height="800px" width="100%"></iframe>
Try to put the Print Function int the Iframe Page
and call it from the Parent
in the PDFFilePage.aspx page
function PrintPDF() {
Windows.Print();
}
and in the Parent
frames[0].PrintPDF()

How to print pdf in iframe using javascript in ie6?

I have displayed a pdf in iframe which is in aspx page. I am working on IE6 browser. I use the following html and javascript code.
<iframe id = "frame_singleCheque" src = "../pdf/SingleCheque.pdf" runat = "server" style ="height:400px; width: 750px; overflow:scroll;" />
function printDoc()
{
window.frames['ctl00_contPlcHdrMasterHolder_frame_singleCheque'].focus();
window.frames['ctl00_contPlcHdrMasterHolder_frame_singleCheque'].print();
}
<input type="button" id = "btnCPrint" value = "Print" onclick="javascript:printDoc()" />
If press print button it shows print dialog. but whenever I press print button it doesn't print any thing. It doesn't print event a blank page. How can I print it?
Try this:
function printDoc() {
document.getElementById('frame_singleCheque').focus();
document.getElementById('frame_singleCheque').contentWindow.print();
}
EDIT: Have a look at this as well.

Categories