pdf file preview like uploaded image file preview

 
1
0
-1

Hello,

How can we preview a pdf file in a form, pdf file previously uploaded ?

Thanks 

    CommentAdd your comment...

    6 answers

    1.  
      2
      1
      0

      hello taxaw,

      you can embed custom html in form, and use code <iframe></iframe> in custom html, use hash form variable for get paramater value. Good luck

      1. taxaw

        Hi Iman, Now that i can preview an pdf file how to chose dynamically the file to preview ? using hash form variable ? Two cases : 1) If the pdf file just got uploaded in the current not saved form, hash form variable will it work ? 2) if we reload an previously saved form, hash form variable will surely work. I am going to test these cases using hash form variable. Thanks for your help. Taxaw

      CommentAdd your comment...
    2.  
      1
      0
      -1

      I got it working for a simple case.

      Put this in custom html field :

      <iframe src="http://127.0.0.1:8080/jw/pdfjs/web/viewer.html?file=http://127.0.0.1:8080/jw/pdfjs/web/compressed.tracemonkey-pldi-09.pdf"  width="1000px" height="400px"></iframe>

       

      I use pdf.js (the viewer) library and iframe.

      Download here a pre built version  https://mozilla.github.io/pdf.js/getting_started/ and copy the folders "build" (for pdf.js files)  and web (for viewer files) to jw folder.

      Test it.

       

        CommentAdd your comment...
      1.  
        1
        0
        -1

        Thank you Owen and Iman.

        I used iframe with custom html and pdfjs (mozilla) with no result certainly because of my bad knowloedge of html.

        I tried also viewerjs but it seems not to work with iframe.

        Can someone make a sample application.

        I think this functionnality is to be added in joget.

        I continue to try this way and will give you a feedback.

        Thanks.

        1. iman maryadi

          hello taxaw, you can use just iframe only and get file pdf with form hash variable, in my computer normal run. this issue is solved.

        2. taxaw

          Hello Iman, can you explain how you get the file. With viewerjs ?

        CommentAdd your comment...
      2.  
        1
        0
        -1

        Hi, you can use library like viewerjs in a Custom HTML element to achieve this.

          CommentAdd your comment...
        1.  
          1
          0
          -1

          Hi Anders, 

          you're right.

          But i need to preview the file in a form, side by side with form data.

          Thanks

            CommentAdd your comment...
          1.  
            1
            0
            -1

            Hi, if you click on the link for the uploaded PDF file, most modern browsers will open to view it in a new window.

              CommentAdd your comment...