Ability to print form to PDF - Ability to print form to PDF

ArdeviaForum

• Created August 19, 2016 12:14

Original Post by Sean Docherty (Imported from Ardevia Forum)

Hello,
If your product had the ability for a form to be printed to PDF format that would be very  useful.
IF you could incorporate this feature into your product I would gladly pay more for the product. Could the ability to print to PDF be developed as a separate module and purchased separately, I would even pay for this feature.

 

If you know of a way to integrate and existing print to PDF product or can recommend a product it would be appreciated.

 

Thank you

0

• 

  ArdeviaForum

  • August 19, 2016 15:15

  Original Post by Liliia (Imported from Ardevia Forum)

  Hi Sean,

   

  We already have this functionality in our backlog for the future, but for now, you can look at:

  How to convert HTML(CSS) To PDF Using JavaScript:Techumber 

  to implement by yourself.

   

  Hope this helps ??

  0
• 

  ArdeviaForum

  • August 19, 2016 15:15

  Original Post by Sean Docherty (Imported from Ardevia Forum)

  Hello,

   

  Is there any update on this request?

  0
• 

  ArdeviaForum

  • August 19, 2016 15:17

  Original Post by iryna (Imported from Ardevia Forum)

  Hello, this functionality is not planned for the nearest releases.
  But it is possible to do it with Html2Canvas and jsPdf.
  Just add a Script Editor Webpart on your form (or any page) and then insert this:

  Code:

  <button id="create_pdf">Download as PDF</button>
  <script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
  <script type="text/javascript" src="//cdnjs.cloudflare.com/ajax/libs/jspdf/1.2.61/jspdf.min.js"></script> 
  <script type="text/javascript" src="//cdnjs.cloudflare.com/ajax/libs/html2canvas/0.4.1/html2canvas.min.js"></script>
  
  <script>
  (function(){
    
      $('#create_pdf').on('click',function(){
          $('body').scrollTop(0);
          createPDF();
          return false;
      });
  
      //create pdf
      function createPDF(){
          html2canvas(document.body /*$(".ard-formwebpart")*/, {
              onrendered: function (canvas) {
                  var imgData = canvas.toDataURL(
                      'image/png');
                  var doc = new jsPDF('p', 'mm');
                  doc.addImage(imgData, 'PNG', 10, 10);
                  doc.save('sample-file.pdf');
              }
          });
      }
    
  }());
  </script>
  

  
  It will show a button that generates page as PDF to download.

  0
• 

  ArdeviaForum

  • August 19, 2016 15:18

  Original Post by Sandy (Imported from Ardevia Forum)

  Hi,

   

  How do you adjust the width and height of the page?

   

  Also, is there any way to remove the ribbon and the site banner and menu navigation from the print?

   

  Cheers
  Sandy

  0
• 

  ArdeviaForum

  • August 19, 2016 15:20

  Original Post by Liliia (Imported from Ardevia Forum)

  Hi Sandy,

   

  To adjust the width and height of the page, add 'a4' for jsPDF method properties:

  Code:

  var doc = new jsPDF('p', 'mm', 'a4');
  

   

   

  And set the width and height of the image as well, e.g. 180x150 mm @ (10,10)mm

  Code:

  doc.addImage(imgData, 'PNG', 10, 10, 180, 150);
  

   

  To remove the ribbon, the site banner and menu navigation from the print, define specific form element in  html2canvas:

  Code:

   

  function createPDF(){
              html2canvas($(".ard-formwebpart.ms-rteKeepStyles"), {
  ...
  

   

  Let me know if you need any further information.

  0

Please sign in to leave a comment.