dojo/dijit e impresión

Question

Deseo poder proporcionar un botón a mis usuarios para que impriman una parte determinada de mi aplicación dojo/dijit. Parece que hay una falta general de documentación y ejemplos a la hora de imprimir.

Por ejemplo, tengo un dijit.layout.ContentPane específico que contiene el contenido que me gustaría imprimir, pero no quisiera imprimir el resto del documento. He visto algunos ejemplos puros de JavaScript en la web donde se lee el node.innerHTML en un iframe "oculto" y luego se imprime desde allí. Sospecho que eso funcionaría, pero me preguntaba si había un enfoque más centrado en el dojo para la impresión.

¿Alguna idea?

Answer 1

He decidido ir por el camino de la lectura en e impresión a partir de ahí, pero porque estoy usando una superficie renderizada dojox.gfx, una lectura directa del Panel de contenido objetivo al iframe invisible no funcionaba correctamente en algunos navegadores. Entonces lo que hago es establecer el "src" del iframe en una página que vuelve a renderizar el diagrama y luego se imprime cuando termina. En el documento principal que se ve algo como esto:

<iframe id="printIFrame4" src="#" style="width: 0px; height:0px; 
    border: none; background: transparent"></iframe> 
<button dojoType="dijit.form.Button" style="margin-top: -3px;" id="buttonPrintMap4"> 
    Print... 
    <script type="dojo/method" event="onClick" args="event"> 
    dojo.byId("printIFrame4").src = "logmap/docMap.php?id=4"; 
    </script> 
</button> 

Y a continuación, la página hace las cosas dojo necesario rediseñaron el diagrama y luego una vez que se ha cargado lo hace a:

this.focus(); 
this.print(); 

Qué sigue entonces a través de la impresión.

Answer 2

Una solución sería la creación de una hoja de estilo sólo de impresión, mientras que la primera regla que oculta todo por defecto:

body { 
    display: none; 
} 

Luego, una segunda regla de CSS, también en su hoja de estilo sólo de impresión, sólo muestra el Dojo panel de contenido:

#contentPaneId { 
    display: block; 
} 

el Dojo ContentPane ID debe coincidir con lo que se utiliza para #contentPaneId en el CSS.

Por último, puede indicar a los navegadores que se trata de una única copia en archivos CSS utilizando media="print" en su link etiqueta:

<link rel="stylesheet" type="text/css" href="printOnly.css" media="print"/>