Dojo/Dijit und Drucken

Question

Ich möchte in der Lage sein, eine Schaltfläche für meine Benutzer bereitzustellen, um nur einen bestimmten Teil meiner Dojo/Dijit-Anwendung zu drucken. Beim Drucken scheint es generell an Dokumentation und Beispielen zu mangeln.

Zum Beispiel habe ich eine spezifische dijit.layout.ContentPane, die den Inhalt enthält, die ich drucken möchte, aber ich möchte nicht den Rest des Dokuments drucken. Ich habe einige reine JavaScript-Beispiele im Internet gesehen, wo die node.innerHTML in einen "versteckten" iframe gelesen und dann von dort gedruckt wird. Ich vermute, dass das funktionieren würde, aber ich fragte mich, ob es einen eher dojozentrischen Ansatz zum Drucken gab.

Irgendwelche Gedanken?

Answer 1

habe ich beschlossen, den Weg des Lesens in und Drucke von dort nach unten zu gehen, aber Da ich eine gerenderte dojox.gfx-Oberfläche verwende, funktionierte ein direktes Lesen vom Ziel-ContentPane zum unsichtbaren iframe in einigen Browsern nicht korrekt. Also setze ich das "src" des iframe auf eine Seite, die das Diagramm neu rendert und dann selbst ausdruckt, wenn es fertig ist. Im Hauptdokument sieht es so etwas wie diese:

<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> 

Und dann wird die Seite der notwendige Dojo Sachen das Diagramm und dann neu entwirft, sobald es geladen ist es tut ein:

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

die dann folgt durch mit dem Drucken.

Answer 2

Eine Lösung wäre, einen Ausdruck nur Sheet zu erstellen, während die erste Regel alles standardmäßig versteckt:

body { 
    display: none; 
} 

Dann wird eine zweite CSS-Regel, auch in Ihrem Druck nur Sheet, zeigt nur das Dojo Inhaltsbereich:

#contentPaneId { 
    display: block; 
} 

Das Dojo ContentPane ID muss dem entsprechen, was Sie für #contentPaneId im CSS verwenden.

Schließlich können Sie Browser anweisen, dass es eine Druckgeschützte Datei CSS media="print" in Ihrem link-Tag:

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