This is a migrated thread and some comments may be shown as answers.

Substitute direct print for PDF export?

1 Answer 638 Views
PDF Export
This is a migrated thread and some comments may be shown as answers.
Ron
Top achievements
Rank 1
Iron
Iron
Ron asked on 22 May 2019, 09:20 PM

We have a client for whom we've created some quotes via tables, repeating headers, the Telerik page numbering, etc., and they've mentioned that they'd like to have the option to be able to print these directly. I notice that most approaches to grabbing and printing HTML recommended online tend to miss a lot of the objects that we have in these reports (one example would be that some of these have child html components or sub-reports) and sizing tends to be an option.

Being that the Kendo tools are already doing their own compiling of the screen is there a way that I could save the captured canvas as a variable and have it print the rendered canvas instead?

 

One other question as well - they've noted that they don't like a continuous white space for reports (without visual page breaks) and would like to see the pages broken out along with page numbers in the preview. I get the impression that I might be able to wrap certain sections in the #fff page coloring and use a darker background color although three things I don't know are 1) how I'd wrap the automatic page breaks, 2) How I'd get the page numbers to show up in such a preview, and 3) how to prevent the program from printing the darker background space and only having it print the #fff white space. It sounds like I may need to place the report space tag in a table with a *ngFor loop and let each part of the report be an iteration of the table just that, again, I'm not sure whether this is something that the Draw or PDF Export tools have any tools to support this type of effort.

 

Let me know your thoughts on these two items and whether either or both can be worked out with the current Kendo modules.

1 Answer, 1 is accepted

Sort by
0
Dimiter Topalov
Telerik team
answered on 27 May 2019, 07:23 AM | edited on 05 Nov 2021, 07:58 AM
https://stackblitz.com/edit/angular-8vcjez?file=app%2Fapp.component.ts

Hi Ron,

Please accept our apologies for the delayed response, but we were short-staffed due to national holidays.

The PDF Export component allow for exporting content that is either visible on the screen or not, and can also apply different styling to the exported content - the elements, rendered in the browser can have one styling, while the ones, exported to the PDF document - another. Also, elements can be visible both on the screen and PDF document, only on the screen, or only in the PDF. Further details are available in the following documentation sections:

https://www.telerik.com/kendo-angular-ui/components/pdf-export/hidden-content/

https://www.telerik.com/kendo-angular-ui/components/pdf-export/content-styling/

You can also use page templates for headers and footers, as well as automatic or manual page breaking in the document:

https://www.telerik.com/kendo-angular-ui/components/pdf-export/multi-page-content/

https://www.telerik.com/kendo-angular-ui/components/pdf-export/multi-page-content/#toc-page-templates

https://www.telerik.com/kendo-angular-ui/components/pdf-export/multi-page-content/#toc-manual-page-breaking

As for direct printing (if by printing you mean physically print the HTML page on paper via a printer device), such functionality is not supported out-of-the-box, but can be achieved via some of the multiple available generic online solutions. However the rich built-in functionality of the PDF export component will be lost. You can also implement some custom solution for generating the PDF, and then open it in a separate browser tab and printing it programmatically, e.g.:

https://stackblitz.com/edit/angular-qqufrq-4pumdv?file=app%2Fprint.directive.ts // print the Grid

Here is an examples for a PDF file opened in a separate tab and then printed programmatically:

https://stackblitz.com/edit/angular-8vcjez?file=app%2Fapp.component.ts

... based on solutions found online, e.g.:

https://stackoverflow.com/questions/2805330/opening-pdf-string-in-new-window-with-javascript/39515978#39515978

https://stackoverflow.com/questions/27463901/setting-window-location-or-window-open-in-angularjs-gives-access-is-denied-in/29125693#29125693

I can suggest researching various similar approaches to find the ones that best match the specific scenario requirements.

Also, as I we are not sure we fully understand the specific scenario questions, can you please describe the use case and desired behavior in further details (e.g. a step-by-step instruction ideally with some visuals that demonstrate the page, and the desired output), so we can try to provide further suggestions, best suitable to the specific scenario, if available? Thank you in advance.

Regards,
Dimiter Topalov
Progress Telerik

Get quickly onboarded and successful with your Telerik and Kendo UI products with the Virtual Classroom free technical training, available to all active customers. Learn More.
Srinivas
Top achievements
Rank 2
Iron
Veteran
Iron
commented on 05 Nov 2021, 07:25 AM

Multiple URL's not working.

Can you please update them please.

Dimiter Topalov
Telerik team
commented on 05 Nov 2021, 07:58 AM

Hi Srinivas,

The links are updated accordingly.

Tags
PDF Export
Asked by
Ron
Top achievements
Rank 1
Iron
Iron
Answers by
Dimiter Topalov
Telerik team
Share this question
or