无法打印 PrimeFaces TexEditor 的内容

Question

PrimeFaces TextEditor 有问题。

我想打印 TextEditor 中的 content，但是当我单击“打印”按钮时，我只得到 blank PDF。可能是代码有错误还是我遗漏了什么？

textEditor.xhtml：

<ui:define name="content">
    <div class="ui-g">
        <div class="ui-g-12">
            <div class="card">
                <h:form>    
                    <h3 style="margin-top:0">Text editor</h3>
                    <p:textEditor widgetVar="editor1" value="#{editorView.text}"  height="400" style="margin-bottom:10px"/>

                    <h:outputText id="text_to_print" escape="false" value="#{editorView.text}" />

                    <p:commandButton value="Preview" update="display" oncomplete="PF('dlg').show()" icon="ui-icon-circle-zoomin" />
                    <p:commandButton value="Print" type="button" icon="ui-icon-print">
                        <p:printer target="text_to_print" />
                    </p:commandButton>
                    <p:commandButton value="Clear" type="button" onclick="PF('editor1').clear();" icon="ui-icon-close" />

                    <p:dialog header="Preview" widgetVar="dlg" showEffect="fade" hideEffect="fade">
                        <p:outputPanel id="display">
                            <h:outputText value="#{editorView.text}" escape="false" />
                        </p:outputPanel>
                    </p:dialog>     
                </h:form>
            </div>
        </div>
    </div>
</ui:define>

托管 bean (EditorView.java)

package org.primefaces.ultima.view.input;

import javax.faces.bean.ManagedBean;

@ManagedBean

public class EditorView {

private String text;

private String text2;

public String getText() {
    return text;
}

public void setText(String text) {
    this.text = text;
}

public String getText2() {
    return text2;
}

public void setText2(String text2) {
    this.text2 = text2;
}
}

Answer 1

你好 Jan，你不更新 text_to_print 很简单

 <h:form>    
                    <h3 style="margin-top:0">Text editor</h3>
                    <p:textEditor widgetVar="editor1" value="#{editorView.text}"  height="400" style="margin-bottom:10px"/>

                    <h:outputText id="text_to_print" escape="false" value="#{editorView.text}" />

如果这不起作用，请检查您的按钮 ID。取决于您的 DOM 树，它可能会有所不同

                    <p:commandButton value="Preview" update="display,text_to_print" oncomplete="PF('dlg').show()" icon="ui-icon-circle-zoomin" />
                    <p:commandButton value="Print" type="button" icon="ui-icon-print">
                        <p:printer target="text_to_print" />
                    </p:commandButton>
                    <p:commandButton value="Clear" type="button" update="text_to_print" onclick="PF('editor1').clear();" icon="ui-icon-close" />

                    <p:dialog header="Preview" widgetVar="dlg" showEffect="fade" hideEffect="fade">
                        <p:outputPanel id="display">
                            <h:outputText value="#{editorView.text}" escape="false" />
                        </p:outputPanel>
                    </p:dialog>     
                </h:form>

您在评论中的问题：

可以通过remoteCommand来完成：

<p:commandButton  value="Go" 
     update="display,text_to_print"
    onsuccess="doAfter()"/>

<p:remoteCommand name="doAfter" oncomplete="document.getElementById('printForm:print').click()"   >

                  </p:remoteCommand>

记得更改表单和按钮。你必须给他们一个Id

 <h:form id="printForm">    
...
  <p:commandButton value="Print" type="button" icon="ui-icon-print" id="print">
                        <p:printer target="text_to_print" />
                    </p:commandButton>