Imprimir un Iframe desde Pagina Padre

[Johichi]

Estimados señores del foro, quiero imprimir el contenido de un DIV y para ello estoy utilizando el pluggin jprint.js de JQuery, el cual crea un Iframe a partir del contenido del DIV, le da el foco al Iframe, manda a imprimir y lanza un alert() (ahi todo bien), el problema es cuando se lo quito el alert(), imprime todo el contenido de la pagina Padre y no el del Iframe, pese a que supuestamente tiene el foco el Iframe. ¿ que puede estar sucediendo en este caso cuando ya no tiene el alert()? o que causa el alert al ejecutarse que hace que funcione bien ... Por favor si alguien tiene una sugerencia al respecto, espero sus comentarios gracias

[maycolalvarez]

el mismo efecto lo puedes hacer con CSS media print, pero con iframes debería funcionar, postea el código para ver, me has dejado intrigado...

[Johichi]

Gracias maycol por tu pronta respuesta, basicamente se trata de un DIV y un Boton imprimir que se mostrara en un modalpopupExtender(que esta detro de una pagina Padre y tiene otros controles mas) que se carga con resultado de x proceso en este caso un comprobante o boleta de x transaccion (puede estar estructurado en una tabla) asi:

<div id="divtestImpresion" runat="server"><table id="Cabecera" style="font-size: 11px; font-family: verdana;" border="0" cellpadding="1" cellspacing="1"><tbody><tr><td rowspan="3" width="15%" align="center" nowrap="nowrap"><img alt="Logo" src="http://www.forosdelweb.com/f13/Images/Sitio/logo.png" align="middle"></td><td width="60%" align="center" nowrap="nowrap">Empresa de Prueba</td><td width="10%" align="right" nowrap="nowrap">Nro.Transacción:</td><td width="15%" align="right" nowrap="nowrap">XXXXXXXXX</td></tr><tr><td width="60%" align="center" nowrap="nowrap">NOTA DE DEBITO XXXXX </td><td width="10%" align="right" nowrap="nowrap">Referencia:</td><td width="15%" align="right" nowrap="nowrap">YYYYYYY</td></tr><tr><td width="60%" align="center" nowrap="nowrap">SUB TITULO</td><td width="10%" align="right" nowrap="nowrap">Fecha:</td><td width="15%" align="right" nowrap="nowrap">16/02/2010</td></tr><tr><td width="15%" align="center" nowrap="nowrap">2010</td><td width="60%" nowrap="nowrap"></td><td width="10%" align="right" nowrap="nowrap">Hora:</td><td width="15%" align="right" nowrap="nowrap">16:41:45</td></tr></tbody></table><table id="Fila0" style="width: 19cm; font-size: 11px; font-family: verdana;" cellpadding="1" cellspacing="0"><tbody><tr><td style="width: 10cm;" align="Left" nowrap="nowrap">CLIENTE: NOMBRE CLIENTE</td><td style="width: 9cm;" nowrap="nowrap"></td></tr></tbody></table><table id="Fila1" style="width: 19cm; font-size: 11px; font-family: verdana;" cellpadding="1" cellspacing="0"><tbody><tr><td style="width: 10cm;" align="Left" nowrap="nowrap">Direccion:</td><td style="width: 9cm;" align="Left" nowrap="nowrap">La direccion del cliente</td></tr></tbody></table><table id="Fila2" style="width: 19cm; font-size: 11px; font-family: verdana;" cellpadding="1" cellspacing="0"><tbody><tr><td style="width: 10cm;" align="Left" nowrap="nowrap">Otro detalle:</td><td style="width: 9cm;" align="Left" nowrap="nowrap">Detalle de otro predetalle</td></tr></tbody></table><table id="Fila3" style="width: 19cm; border-bottom: 1px solid black; font-size: 11px; font-family: verdana;" cellpadding="1" cellspacing="0"><tbody><tr><td></td></tr></tbody></table><br><br><br><table id="Pie" style="width: 19cm; font-size: 11px; font-family: verdana;" border="0" bordercolor="gainsboro" cellpadding="1" cellspacing="0" height="70"><tbody><tr><td width="20%" align="center" height="10%" nowrap="nowrap">&nbsp;</td><td width="20%" align="center" height="10%" nowrap="nowrap">&nbsp;</td></tr></tbody></table><table width="100%"><tbody><tr><td align="center"></td></tr></tbody></table></div>

el boton Imprimir llama a la funcion

function imprimir() {
$(function() {
var texto = "";
texto = texto + '<div id="otroDiv"></div>';
document.getElementById('divtestImpresion').innerH TML = texto; //incluso puedes enviarle a cargar otros datos al mismo DivImpresion
$.jPrintArea('#divtestImpresion');

});
}

a este punto ya se envia el divImpresion a jPrintArea() que es el que se encarga de crear el Iframe, mandar a imprimir y lanza su bendito alert.

//pluggin jprint.js

contenido del jprint

jQuery.jPrintArea = function(el) {
var iframe = document.createElement('IFRAME');
var doc = null;
$(iframe).attr('style', 'position:absolute;width:0px;height:0px;left:-500px;top:-500px;');
$(iframe).attr('id', 'ifr'); //agregado para pruebas
$(iframe).attr('name', 'ifr'); //agregrado para pruebas
document.body.appendChild(iframe);
doc = iframe.contentWindow.document;

//alert("asdasd");
doc.write('<script> function vaina(){document.getElementById("otroDiv").innerHT ML = "contenido del otroDiv"; window.print(); } </script>'); //para prueba de que se
//carga tambien en el otro div que se envio desde la pagina padre
doc.write($(el).html());
doc.close();
//ejecutando para prueba la funcion vaina que se crea en la pagina del Iframe con agreado al otroDIV y una funcion print()

iframe.contentWindow.focus();

valor1 = window.frames['ifr'];
valor1.vaina();
//iframe.contentWindow.print();
//alert('Printing...');

}



espero que mi explicacion se entendible

[Johichi]

Creo que ya identifique el problema en este caso, al parecer todo es por que estoy enviando un Tag Imagen(el Logo), si se lo quito y solo envio datos texto, lineas Imprime bien!...por que la imagen causa este efecto?...no lo se, gracias

[maycolalvarez]

las imágenes tardan tiempo en cargar, lo mejor es que dumpees en el iframe una estructura de html con body y coloques en el evento onload la llamada a imprimir.


PD: y trata de organizar el código, nadie estaría dispuesto a leer es así

[Johichi]

Disculpa maycol por el codigo si te refieres al contenido del div era para copiar y pegar en el body de una pagina x y ver la estructura....nada mas, y si, al parecer es bastante confunso

[Johichi]

Gracias maycol por tu sugerencia, y si tienes mucha razon...ya solucione este caso a partir de que dijiste que las imagenes tardan más (que el texto) en cargarse...entonces me ingenie que espere a que cargue bien el iframe y luego darle el foco e imprimir, paso seguido removerlo y todo bien, gracias

[maycolalvarez]

bien, perfecto que lo solucionaras; te digo lo del código porque muchos en el foro al ver eso, descartan la intención de ayudarte, mientras más corto y detallado sea el post, mejor.

también puedes incluir código, pero trata de organizarlo y tabularlo, y usa de preferencia la herramienta del foro highlight ubicada en una lista del editor, con eso se resalta el código según el lenguaje

Código Javascript:

alert('esto es código javascript');