I want to print the content of the iframe. I viewd several examples but non of them helped me for my case. I have the following piece of code
<div id="print-area">
<iframe src='data:text/html;charset=utf-8,<?php echo $content ?>'></iframe>
</div>
And when the #print button is clicked: (this code prints out the content of the div #print-area)
$("#print").click(function (e) {
var newWindow = window.open();
newWindow.document.write($('#print-area').html());
newWindow.print()
});
The code works and print window is prompted, but when I try to put content of the iframe in the document.write(...) the function does not work. Any idea?
tried solutions:
Print iFrame content using Javascript
How to Print iframe content
and from other topics, but did not manage to print my iframe content
use
<iframe id="abcd" src='data:text/html;charset=utf-8,<?php echo "someHtmlContent" ?>'>
</iframe>
var newWindow = window.open();
newWindow.document.write($('#abcd').contents().find("html").html());
newWindow.print()
because iframe is a independent page it not access by windows class
that why use parent class
Related
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!
I'm simply trying to load another webpage in my webpage using the object tag or iframe. Then, I would like to remove some element of the loaded page with jQuery.
Here is my code
<div>
<object type="text/html" data="http://ebird.org/ebird/map/eurtre1" width="100%" height="400px" id="eurtre1">
</object>
</div>
<script>
jQuery( window ).load(function() {
jQuery('#map-sidebar').remove();
});
</script>
And, as you guess, it is not working...
I have tried:
jQuery('#eurtre1').contents().find('#map-sidebar')
and
jQuery('#eurtre1')[0].contentDocument.children
The wired thing is that on my browser, I can do it in the console, once I've selected the inside of the object...
Any idea ?
Here's a link to a similar question:
how to access an iframe and affect it with jQuery
Basically you can't due to Javascript same-origin policy but if you have access to the loaded content in the iframe you could use window.postMessage
You could also add a parameter to the iframe's src tag to post a message, something like this:
<iframe src="http://www.example.com?hideElement=true"></iframe>
Again you will have to have access the content of the iframe to check the param and execute your code.
I have this part of code:
<div class="embed"><iframe id="iframe" src="<?php echo DOMAIN_NAME; ?>demo?q=<?php echo $number;?>"><body></body></iframe></div>
and i want to make an asychronous script that includes this iframe. So in the end i will give in my clients the asynchronous script code instead of iframe. I want to do that for 1 main reason. In case my website is down i don't want to decrease the speed of the websites/portals that my clients have post my iframe.
when somebody clicks on embed div then an iframe given to my clients. i want to give an asychronous script instead of this iframe.
Is it possible?
Any ideas?
You mean something like
var cosnikFrame = document.createElement("iframe");
cosnikFrame.width=450;
cosnikFrame.height=300;
cosnikFrame.setAttribute("scrolling","no");
cosnikFrame.style.border=0;
document.body.appendChild(cosnikFrame);
cosnikFrame.src="http://example.com/demo.php?q=12aA1b35A4a";
or to defer to after load using for example jQuery:
$(function() {
$("body").append('<iframe width='450' height='300' scrolling="no" style="border:0" src="http://example.com/demo.php?q=12aA1b35A4a"></iframe>');
});
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) ?
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()