I am having problem with pdf export with header template, we use letter size but however papersize "letter" in pdf export doesn't include all fields and so smaller in size
going up on paper size does help like using A1 is perfect but we use letter for everything,
here below is what I have...
<script type="x/kendo-template" id="Pdf-template">
<div class="page-template">
<div class="header">
<div style="border:1px solid black;width:35%;float:left;padding:10px;">
<div>Scenario: <b>@ViewBag.Rule</b></div>
<div>Scenario\#: <b>3</b></div>
<div>
<div style="float:left">
Run Date: <b>@DateTime.Now.ToShortDateString() </b>
</div>
<div style="float:right;padding-left:20px;">
Rule Version: <b>@ViewBag.RuleVersion</b>
</div>
</div>
<br />
<div>Data Ingestion: <b>@ViewBag.DataIngestion.ToShortDateString()</b></div>
</div>
<div style="border:1px solid black;float:left;width:20%;padding:10px;margin-left: 15%;">
<div> Total Patient Population: <b id="TotalPatients1">@ViewBag.TotalPatients</b></div>
<div>
<div style="float:left"> Matching Patient Population: <b id="MatchingPatients1">@ViewBag.MatchingPatients</b> </div> <div style="float:right;margin-right:5%;"> <b id="MatchingPercentage1">@((((double)ViewBag.MatchingPatients / (double)ViewBag.TotalPatients)).ToString("P2"))</b></div>
</div>
</div>
</div>
</div>
</script>
.Pdf(pdf => pdf
.AvoidLinks()
.AllPages(true)
.PaperSize("Letter")
.Margin("5.5cm", "1cm", "1cm", "1cm")
.Landscape()
.RepeatHeaders(false)
.TemplateId("Pdf-template")
.FileName("filename.pdf")
.ProxyURL(Url.Action("Pdf_Export_Save", "Grid"))
)
9 Answers, 1 is accepted
You can try applying custom styles to the exported content, so that the Grid and header take up less space. You can decrease the font sizes during export only using the k-pdf-export class to target elements inside the exported Grid. Also, using this class, you can change the Grid column widths, so the Grid information fits better into the page:
Change Column Widths during PDF Export
With regard to the header template, you can apply the smaller font size explicitly in the inline styles that you already have inside the template declaration.
<script type="x/kendo-template" id="Pdf-template"> <div class="page-template"> <div class="header"> <div style="border:1px solid black;width:35%;float:left;padding:10px;font-size:10px"> <div>Scenario: <b>@ViewBag.Rule</b></div> <div>Scenario\#: <b>3</b></div> <div> <div style="float:left"> Run Date: <b>@DateTime.Now.ToShortDateString() </b> </div> <div style="float:right;padding-left:20px;"> Rule Version: <b>@ViewBag.RuleVersion</b> </div> </div> <br /> <div>Data Ingestion: <b>@ViewBag.DataIngestion.ToShortDateString()</b></div> </div> <div style="border:1px solid black;float:left;width:20%;padding:10px;margin-left: 15%;font-size:10px"> <div> Total Patient Population: <b id="TotalPatients1">@ViewBag.TotalPatients</b></div> <div> <div style="float:left"> Matching Patient Population: <b id="MatchingPatients1">@ViewBag.MatchingPatients</b> </div> <div style="float:right;margin-right:5%;"> <b id="MatchingPercentage1">@((((double)ViewBag.MatchingPatients / (double)ViewBag.TotalPatients)).ToString("P2"))</b></div> </div> </div> </div> </div></script>Regards,
Tsvetina
Progress Telerik
Rank 1
Hi tsvetina,
i applied some changes as u described,
1. however i still cannot figure out why only few records are exported... there needs to be 20 records as i am exporting first page it contains 20 records but i could see only 9 records.
2. Mainly i still don't see grid header
There does not seem to be enough space for the Grid content to fit in the page. You can try using a Scale less than 1, as well as change the page orientation to portrait. I tried a Grid with Page Size = 20 with the following settings:
.Pdf(pdf => pdf .AvoidLinks() .AllPages(true) .PaperSize("Letter") .Margin("3cm", "1cm", "1cm", "1cm") .Scale(0.6) .RepeatHeaders(false) .TemplateId("Pdf-template") .FileName("filename.pdf") .ProxyURL(Url.Action("Pdf_Export_Save", "Grid")) )and it was properly fitted inside the page. Try different combinations of margins, scale and page orientation to see which fits your page and Grid content best.
Regards,
Tsvetina
Progress Telerik
Rank 1
Hi Tsvetina,
.net core telerik, pdf export doesn include toolbar, i am not hiding it on export. do i have to anything extra for it to include toolbar
.Pdf(pdf => pdf .AvoidLinks() .AllPages(false) .PaperSize("Letter") .Landscape(true) .RepeatHeaders(false) .FileName("PatientsReport.pdf") .ProxyURL(Url.Action("Pdf_Export_Save", "Grid")) )
.ToolBar(toolbar => { toolbar.ClientTemplateId("PatientGridToolbarTemplate"); })Since Q2 2016, the Grid will automaticlly remove the toolbar, footer, pager and grouping header if you set the PaperSize option to anything different than "auto". This is done to allow more meaningful output with the automatic page breaking feature.
You can set PaperSize("auto") in order to have the toolbar show in the Grid or use a page template with a header to replace the toolbar content. An ASP.NET Core example of an export with a template is available in the Grid PDF Export demo.
Regards,
Tsvetina
Progress Telerik
Rank 1
.Pdf(p=>p.PaperSize("auto"))
.ToolBar(toolbar =>
{
toolbar.ClientTemplateId("PatientGridToolbarTemplate");
})
<script id="PatientGridToolbarTemplate" type="text/x-kendo-template">
<div style="height:125px;padding-top:3px;">
<div style="border:1px solid black;width:35%;float:left;padding:10px;">
<div>Scenario: <b>@ViewBag.Rule</b></div>
<div>Description: <b>@ViewBag.RuleDescription</b></div>
<div>
<div style="float:left">
Run Date: <b>@DateTime.Now.ToShortDateString() </b>
</div>
@if (Common.HasClaim("ViewRule", "1"))
{
<div style="float:right;padding-left:20px;">
Rule Version: <a id='RulebyVersion' style='color:black;text-decoration:none' href='/Rule/DisplayRule?RuleId=@Model&ViewActive=true'><b>@ViewBag.RuleVersion</b></a>
</div>
}
else
{
<div style="float:right;padding-left:20px;">
Rule Version: <b>@ViewBag.RuleVersion</b>
</div>
}
</div>
<br />
<div>Data Ingestion: <b>@ViewBag.DataIngestion.ToShortDateString()</b></div>
<div> Rule Engine: <b>@ViewBag.RuleEngine</b></div>
</div>
<div style="border:1px solid black;float:right;width:20%;padding:10px;margin-right: 5%;">
<div> Total Patient Population: <b id="TotalPatients">@ViewBag.TotalPatients</b></div>
<div>
<div style="float:left"> Matching Patient Population: @ViewBag.Percentage <b id="MatchingPatients"></b> </div> <div style="float:right;"> <b id="MatchingPercentage"></b></div>
</div>
</div>
</div>
<div style="float:left;width:100%;padding-bottom:5px">
<div style="float:left;width:30%;padding:4px;">
<a role="button" class="k-button k-button-icontext k-grid-excel" href="\\#"><span class="k-icon k-i-file-excel"></span>export to excel</a>
<a role="button" id="gridExportPdf" class="k-button k-button-icontext k-grid-pdf" href="\\#"><span class="k-icon k-i-file-pdf"></span>export to pdf</a>
</div>
</div>
</script>
I tried the same template in the attached project but on my side the toolbar is exported as well when PaperSize("auto") is set. Could you run the project and see if I am missing anything important?
Also, what version of Kendo UI are you using?
Regards,
Tsvetina
Progress Telerik
Rank 1
Rank 1
Thank you tsvetina,
found the prob