+ Start a Discussion
Rodrigo Ferreira 11Rodrigo Ferreira 11 

VF Page renderAs PDF (JavaScript not rendered)

Hi everybody,
I'm trying to render a VF Page which contains JavaScript to Generate a QR Code like so:
VF Page:
User-added image
But PDF after the renderAs is all messed up:
User-added image
Anyone knows how to render Javascript to PDF?
Best Answer chosen by Rodrigo Ferreira 11
mukesh guptamukesh gupta
Hi Rodrigo,

Please follow url
:-
https://0to1code.wordpress.com/2016/06/04/generate-qr-code-for-any-object-in-5-min/

Regards
Mukesh

All Answers

Raj VakatiRaj Vakati
Can you share the code to see the issue 
mukesh guptamukesh gupta
Hi,

You should ensure that you add these sites under remote site setting in salesforce.

Go to Setup | Security Controls | Remote Site settings, click New Remote Site, add a name and the url http://chart.apis.google.com, and ensure it is Active. Do the same for the other site as well to ensure it works. I tried your same code in my test org and it didnt work before adding the remote sites. Once I added them, it works fine.

Kindly mark my solution as the best answer if it helps you.

Thanks
Mukesh


 
Rodrigo Ferreira 11Rodrigo Ferreira 11

Hi Raj V,
the Javascript that generates the QR Code is stored in a Static Resource, which I reference in the VF PAge like so:
<apex:includeScript value="{!$Resource.QRCodeGenerator_js}"/>

Then I have a div to show the QR Corde:
<div id="printQR{!rowNum}" style="width:80px; height:80px; margin-top:0px; " ></div>

Below is the <script> tag in the VF Page where I reference the Javascript form the static resource:

<!--      QR code Creation with javascript from static resource    -->
 <script type="text/javascript">
var qrcode = new QRCode(document.getElementById("printQR{!rowNum}"), { width : qrWidth, height : qrHeight });
function makeCode() {
   var assetInfo = document.getElementById("assetID{!rowNum}");                                           qrcode.makeCode(assetInfo.innerHTML);
 }
makeCode();
var data64QR = document.getElementById("printQR{!rowNum}").childNodes[1]; data64QR.setAttribute("class", "imgQR");
</script>

Any idea me how to render the QR Code  as PDF?
 

Rodrigo Ferreira 11Rodrigo Ferreira 11
Hi Mukesh,
I've added the url:  http://chart.apis.google.com to Remote Sites like you said, as well as the other 2 url's:
1 for the VF Page;
- 1 for the url of the VF Page rendered as PDF

But I still get the same PDF problem (it doesn't display the QR Corde generated by javascript):
User-added image
 
mukesh guptamukesh gupta
Hi Rodrigo,

Please follow url
:-
https://0to1code.wordpress.com/2016/06/04/generate-qr-code-for-any-object-in-5-min/

Regards
Mukesh
This was selected as the best answer