use p:media or p:documentViewer with p:dialog dynamic

Question

first of all you should know that I am new to web application development with jsf, so if I ask for bad things please correct me.

I need to develop a table that shows the description of a pdf file and a button to display it in a dialog box, (important should not be able to download, copy or print this file). I have exhausted all my possibilities with the and , but when displaying the dialog box, the document is not displayed, this is my code:

<h:body>  <ui:composition template="/template/plantilla.xhtml">  <ui:define name="content">
      <h:form id="frmpdf">
          <div align="center"><h:outputText value="Docs .PDF" style="font-weight: bold;"/>
           </div>   <p:dataTable id="dtdpdf" 
                       var="dpdf" 
                     value="#{documentosPdfBean.listdocpdf}" >

              <p:column headerText="Descrip" style="width: 90%;">
                  <h:outputText value="#{dpdf.sgTfd_descripcion}" />
              </p:column>
              <p:column headerText="Open">   
                 <p:commandButton value="open" 
                                  oncomplete="PF('dlg3').show();" 
                                  update="frmpdf:dlgpdf" /> 
              </p:column>
           </p:dataTable>  <p:dialog id="dlgpdf" header="document" widgetVar="dlg3"              showEffect="explode" height="100" dynamic="true">
               <p:media value="/resources/document/manual.pdf" width="100%" height="300px"/>  
                    </p:dialog>                          
                </h:form>
            </ui:define>
        </ui:composition>            
    </h:body> 

I have also used:

<p:commandLink title="manual" onclick="PF('dlg3').show()"  />

result

The above develop it taking into account this post

Answer 1

After doing more research, I managed to solve my problem with the tag that allows to establish a value from the bean when this event is triggered, I leave the code with the solution:

<f:view>

<h:head>
    <title>Page</title>
    <script type="text/javascript" src="/js/keyboard.js" charset="UTF-8"></script>    
    <link rel="stylesheet" type="/text/css" href="/js/keyboard.css" />
</h:head>       

<h:body>  
    <ui:composition template="/template/plantilla.xhtml">
        <ui:define name="content">
            <h:form id="frmpdf">
                <f:event listener="#{documentPdfBean.onPrerender}" type="preRenderView" />
                <div align="center">
                    <h:outputText value="Docs. PDF" style="font-weight: bold;"  />
                </div>   
                <p:dataTable id="dtdpdf" var="dpdf" value="#{documentPdfBean.listdocpdf}" >
                    <p:column headerText="Descrip" style="width: 90%;">
                        <h:outputText value="#{dpdf.sgTfd_descripcion}" />
                    </p:column>
                    <p:column headerText="open">   
                        <p:commandLink styleClass="fa fa-file-pdf-o" onclick="PF('dlgpdf').show()" 
                                       update="frmpdf:pdfvisualizer" style="width: 10px; font-size: 20px; margin-left: 24%;">
                            <f:setPropertyActionListener target="#{documentPdfBean.ruta}" value="#{dpdf.sgTfd_valor}" />
                        </p:commandLink>
                    </p:column>                            
                </p:dataTable>                                                                
                <p:dialog widgetVar="dlgpdf" height="700" width="750" header="pdf" maximizable="true" minimizable="true" 
                          resizable="false" dynamic="true" showEffect="clip"> 
                    <pe:documentViewer height="700" id="pdfvisualizer"  value="#{documentPdfBean.ruta}" />
                </p:dialog>
            </h:form>
        </ui:define>
    </ui:composition>            
</h:body> </f:view>

bean

 private String ruta;

public String getRuta() {
    return ruta;
}

public void setRuta(String ruta) {
    this.ruta = ruta;
}