2

I am exporting HTML to PDF via Weasyprint in my Django app. I have noticed that if I send the template html to front end and return that html to backend to export it to pdf, it prints perfectly. But if I directly send template html to Weasyprint, it messes up everything! No css, no javascript.

This is how I'm using the template to generate html:

template = loader.get_template('Reporting/reportTemplate.html')
context = {
    "reportObj" : result[0]
}    

htmlContent = (template.render(context, request))
response['message'] = htmlContent
return JsonResponse(response)

In my JS controller I assign the htmlContent to my div:

$('#htmlContent').html(response.message);

Then I return the generated html back to my Django function to print pdf

HTML(string=htmlContent).write_pdf(target=response, stylesheets=[CSS(string=getCSS())])

This way it maintains the design and everything.

But when I send htmlContent directly to Weayprint without sending it to front end, the design and coloring is gone!

In my template, I even have included CSS and Javascript files like this:

{% load static %}
{% block content %}
 <link href="{% static "css/ion.rangeSlider.css" %}" rel="stylesheet">
 <link href="{% static "css/ion.rangeSlider.skinHTML5.css" %}" rel="stylesheet">
 <script type='text/javascript' src='{% static "scripts/ion.rangeSlider.js" %}'></script>

<script type='text/javascript'>
$(document).ready(function(){
    var creditScore = $("#creditScore").html();

    $("#rangeCS").ionRangeSlider({
        type: "double",
        min: 0,
        max: 1000,
        step: 100,
        from: 0,
        to: creditScore,
        from_fixed: true,
        to_fixed: true,
        grid: true,
        grid_snap: true
    });
});
</script>

 {% endblock  %}

How can I execute Javascript and CSS in Django template and export to PDF without having to send it to front end?

Tahreem Iqbal
  • 985
  • 6
  • 17
  • 43

2 Answers2

1

Are you meaning you've JS in the template that you render as source for Weasyprint ? Because JS used that way runs only on a client side (like browsers) and Weasyprint won't run it, it cannot. You must provided the final document (HTML) to Weasyprint.

If you've CSS issues in your PDF, so maybe you're using unsupported CSS features for Weasyprint.

mille_a
  • 121
  • 8
  • I'm using rangeSlider in my template to display a certain kind of data. Is there a way to execute the Javascript before sending it to weasyprint, without having to send it to browser? – Tahreem Iqbal Oct 06 '16 at 10:32
  • I think you need a way to execute javascript engine where your django app is running. You can use something like http://jeanphix.me/Ghost.py/ or Selenium+Phantom webdriver to run the site and generate the content – Willemoes Oct 06 '16 at 11:35
1

Like mille_a said, you can't execute javascript code into a pdf.

So to resolve your problem you need to do it into your view :

# do some python stuff to get somes datas 
datas = ...

# assign it into your html
htmlContent = my_html_template.render(datas)

# call the pdf generation
HTML(string=htmlContent).write_pdf(target=response)

You can see this example for more details : http://www.supinfo.com/articles/single/379-generate-pdf-files-out-of-html-templates-with-django

Hope it helps.

Bloodbee
  • 827
  • 8
  • 23