0

I'm using kendos exportpdf function to convert html template into pdf file in django framework.pdf file comes/looks good. when we use only text within template. When I have added block of content using css(bootstrap cards) the text along with block is breaking(as per below screenshot) when it comes to end of the page. Can anyone help me to resolve this issue and please let me know if any additional information to be added for clear understanding.

enter image description here

Adrian Krupa
  • 1,877
  • 1
  • 15
  • 24
user13898502
  • 13
  • 3

1 Answers1

0

Kendo's exportpdf uses the Kendo drawing library, which has a keepTogether setting allowing you to set which CSS classes that should not be split across pages.

drawing.drawDOM("#content", {
  paperSize: "A4",
  margin: "2cm",
  keepTogether: ".prevent-split"
}).then(function(group){
  drawing.pdf.saveAs(group, "filename.pdf");
});

additional details here: https://docs.telerik.com/kendo-ui/framework/drawing/pdf-output/multi-page-content#preventing-page-breaking-in-elements

G_P
  • 2,100
  • 3
  • 16
  • 18
  • Thank you for your response @G_P, I have used this already in my code, still I'm getting this error. Can you please let me know how can add multiple classes within 'KeepTogether' key. – user13898502 Jul 10 '20 at 13:54
  • yes, from that link, it mentions keepTogether accepts CSS selectors that are passable to querySelector. If you go to https://developer.mozilla.org/en-US/docs/Web/API/Document/querySelector or https://stackoverflow.com/a/59406548/493557 you can see examples of how to pass multiple classes with different requirements. For example, setting keepTogether to ".prevent-split .myClass2 .myClass3" – G_P Jul 10 '20 at 14:05
  • Thanks again for references, I've scaled down the pdf which resolved my issue and adding classes to the keepTogether settings also a better solution. I've accepted your solution. – user13898502 Jul 10 '20 at 17:56