CODEWITHSUNDEEP
jsfprimefacesjsf-2glassfish
user7833580
user7833580

Reputation:

Cannot print content of PrimeFaces TexEditor

I have a problem with PrimeFaces TextEditor.

I want to print content that is inside TextEditor, but when I click "Print" button I only get blank PDF. Is there maybe a mistake in code or I missed something?

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>

Managed 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;
}
}

Upvotes: 2

Views: 1059

Answers (1)

pwain
pwain

Reputation: 279

Hello Jan it is very simple you do not update the 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}" />

If this does not work please check your button id. Depends on your DOM tree it may be different

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

your quesiton from the comment:

It can be done with the remoteCommand:

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

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

                  </p:remoteCommand>

remember to change your form and your button. you have to give them an 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>

Upvotes: 1

Related Questions