printing iframe

dukeTemplar · Apr 6, 2011

Hi. im currently developing a print function where i create an iframe on the fly and try to print it. It works fine in FF but ie and chrome just wont work! it doesnt print. Does anyone have a clue how to reference the object?

function print(){

// Create an iFrame with the new name.
// Hide the frame (sort of) and attach to the body.
var ifrm = document.createElement("iframe");
ifrm.setAttribute("name", "printFrame");
ifrm.setAttribute("id", "printFrame");
ifrm.setAttribute("src", "");
ifrm.style.width.value = "400px";
ifrm.style.height.value = "400px";
document.body.appendChild(ifrm);

// Get a FRAMES reference to the new frame.
var objFrame = window.frames["printFrame"];

// Get a reference to the DOM in the new frame.
//var objDoc = objFrame.document;
var objDoc =window.frames["printFrame"].document;

// Grab all the style tags and copy to the new document
var headTags = document.getElementsByTagName('head')[0].innerHTML;
//console.log("headTag: "+headTags);

// Write the HTML for the document. In this, we will write out the HTML of the current element.
objDoc.open();
//objDoc.write( "<!DOCTYPE html PUBLIC \"-//W3C//DTD XHTML 1.0 Transitional//EN\" \"

http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd\">"

);
objDoc.write( "<!DOCTYPE HTML PUBLIC \"-//W3C//DTD HTML 4.01 Frameset//EN \">" );
objDoc.write( "<html>" );
objDoc.write( "<body>" );
objDoc.write( "<head>" );
objDoc.write( "<title>" );
objDoc.write( document.title );
objDoc.write( "</title>" );
objDoc.write( headTags );
objDoc.write( "</head>" );
objDoc.write( content );
objDoc.write( "</body>" );
objDoc.write( "</html>" );
objDoc.close();

// Print the document.
objFrame.focus();
objFrame.print();

}

BillyRayPreachersSon · Apr 17, 2011

When creating iframe elements dynamically, I've always used this code to get a handle to the document and window elements of an iframe:

var theFrame = document.createElement('iframe');
//document.body.appendChild(theFrame); // Without this step, a lot of the frame's properties are not set

var theFrameWin = theFrame.contentWindow;
var theFrameDoc = theFrame.contentDocument || theFrame.contentWindow.document;

// Then your writing code...
theFrameDoc.open();
theFrameDoc.write('...');
theFrameDoc.close();

// At this point, I would access the print() method via theFrameWin, not via theFrame, as it is
// a method of the window's prototype object, not of the HTMLIFrameElement:

alert(Object.getPrototypeOf(theFrame).hasOwnProperty('print')); // false
alert(Object.getPrototypeOf(theFrameWin).hasOwnProperty('print')); // true

Thus theFrameWin.print(). I realise you're getting the iframe via the window's frames collection, which in theory will give you the object not the element, but I thought it worth mentioning anyway in case it helps at all.

Dan

Coedit Limited - Delivering standards compliant, accessible web solutions

Dan's Page [blue]@[/blue] Code Couch:

http://www.codecouch.com/dan/

Code Couch Snippets & Info:

http://www.codecouch.com/

The Out Atheism Campaign

Tek-Tips is the largest IT community on the Internet today!

Members share and learn making Tek-Tips Forums the best source of peer-reviewed technical information on the Internet!

printing iframe

dukeTemplar

Programmer

BillyRayPreachersSon

Programmer

Similar threads

Part and Inventory Search

Sponsor