Hi,
I am getting extra characters like þÿPDF Check in metadata of the exported PDF from Kendo grid. That reflects into the title of the PDF in chrome browser.
Is there any way to remove that extra characters from the metadata using jQuery?
I am attaching screenshot of the PDF file.
Hi, I would like to know if there is a way to load a PDF stored as VARBINARY(MAX) in a SQL Server Filestream field.
Thank you in advance.
Hello,
I'm using a Grid control with virtual scrolling. When I export to PDF, the content runs right off of the bottom of the page without breaking to a new page.
I have my datasource's page size set to 100 records to limit the number of times the grid will need to fetch new data from the server. If I change this to only 5 records, for example, then the PDF will create a page break after 5 records. However, I am also using grouping on the data. If every row is in its own group, I can get about 6 or 7 rows onto a page. If every row falls under the same group, I can get about 13-15 rows onto a page. Because the number of rows per page may vary, I can't resort to setting the page size on the datasource.
My main concern at the moment is getting automatic page breaking to work. In the screenshot I've attached, you can see that there is still some data at the very bottom of the page that is cut off. There should be 11 rows of data, across 6 groups, but only 9 rows manage to fit onto the page. Relevant code below:
.Pdf(pdf => pdf
.FileName("BidAwards.pdf")
.AllPages()
.PaperSize("A4")
.Landscape()
.AvoidLinks()
)
.DataSource(dataSource => dataSource
.Ajax()
.PageSize(100)
.Events(events => events.Error("error_handler"))
.Model(model => model.Id(col => col.BidId))
.Read(read => read.Action("BidAwardGridData", "Reports", Model))
.Group(groups => groups.Add(col => col.GroupValue))
)
I'd also like to find a way to keep entire groups of rows on a page if possible. In other words, if the whole group won't fit on the remainder of the page, break to a new page for that group.
Unfortunately, for the time being I'm stuck on an older version of the Telerik controls, and can't easily update until after this development cycle is completed (unless it's necessary to fix this).
Thanks!!!
Hi,
May I know what to install/need for editable PDF (eg: PDF editor)?
I've go through this blog https://www.telerik.com/blogs/editing-pdf-files-in-browser-adding-signature-text-images .
But I failed to get the result as follows:
Much appreciate if you can reply ASAP. Thank you!
I currently have the following setup and it works fine. However, I need to make my controller endpoint POST and be able to pass the data that will be loaded in the PDF from the client. The examples I have found with fromFile point to a GET endpoint that takes simple parameters like Id but I need to be able to pass the actual content to be loaded in the returned PDF. Hoping someone knows a way if that is at all possible.
JavaScript
function previewPdf(){
//I need to pass this doc object to the endpoint
//var doc = {
// case: { caseNumber: 'A12345' },
// title: 'Test Doc',
// body: $('#Content').data("kendoEditor").value() //getting content from a kendo editor the user is filling out
//};
// Create a viewer if you do not have one already.
var pdfViewer = $("#pdf-viewer").data("kendoPDFViewer");
if(!pdfViewer){
pdfViewer = $("#pdf-viewer").kendoPDFViewer({
pdfjsProcessing: {
file: ""
},
width: 900,
height: window.innerHeight - 150
}).data("kendoPDFViewer");
}
var pdfHandlerUrl = '@Url.Action("GetCourtDocumentPdfBytes", "CourtDocuments")';
// I was hoping to make an AJAX call like this and then somehow set the file to the PDF viewer but no luck.
//$.ajax({
// type: "POST",
// url: pdfHandlerUrl,
// data: JSON.stringify(doc),
// contentType: "application/json",
// success: function(response) {
// // Use the response (which should be a byte array of the PDF) to update the PDF viewer
// pdfViewer.fromFile(response); // this doesn't work so clearly not setting the right type here.
// }
//});
// Build the desired URL to point to your handler that will return the PDF.
pdfViewer.fromFile(pdfHandlerUrl); //this is working fine just for a GET endpoint
$("#wndPdfPreview").kendoWindow({
modal: true,
width: 1000,
height: window.innerHeight - 100
});
$("#wndPdfPreview").data("kendoWindow").center().open();
}
My Controller endpoint.
//this approach is working.
public async Task<FileStreamResult> GetCourtDocumentPdfBytes()
{
CourtDocument doc = new CourtDocument { Body = "the Body", Title = "the title", Case = new Case { CaseNumber = "2018123CA01" } };
string html = await this.RenderViewToString("_JudicialOrder", doc, true);
var bytes = await _pdfService.CreateFromHtml(html, doc.Case.CaseNumber);
Stream stream = new MemoryStream(bytes);
return new FileStreamResult(stream, "application/pdf");
//return File(bytes, "application/pdf", "test.pdf");
}
//This is more of what I would need.
public async Task<IActionResult> GetCourtDocumentPdfBytes([FromBody] CourtDocument doc)
{
string html = await this.RenderViewToString("_JudicialOrder", doc, true);
var bytes = await _pdfService.CreateFromHtml(html, doc.Case.CaseNumber);
Stream stream = new MemoryStream(bytes);
//return new FileStreamResult(stream, "application/pdf");
return File(bytes, "application/pdf", "test.pdf"); // not sure what to return here to load the pdfViewer from it in the client.
}
I am trying to use the PDFViewer to display a PDF downloaded from an Azure Blob.
In my view I have:
// Create a viewer if you do not have one already. var pdfViewer = $("#pdfViewer").data("kendoPDFViewer"); if (!pdfViewer) { pdfViewer = $("#pdfViewer").kendoPDFViewer({ pdfjsProcessing: { file: "" }, width: "100%", height: 500 }).data("kendoPDFViewer"); }; // Build the desired URL to point to your handler that will return the PDF. var pdfHandlerUrl = "/Home/getBlob/" + selectedRows.BlobID; // Make the PDFViewer load the designated file. pdfViewer.fromFile(pdfHandlerUrl);
An in my controller (getBlob) I have the following:
var stream = new MemoryStream(); await file.DownloadToAsync(stream); stream.Position = 0; return new FileStreamResult(stream, "application/pdf");
But in the view - I get a pop-up error message that says: PDF file fails to process.
Any suggestions?
Hello,
I am using the exact example give below in my project:
https://demos.telerik.com/aspnet-mvc/pdf-export
But when i browse this url in my iPhone Safari browser, I am not able to export the PDF. Export as Image and SVG works though. I am seeing the same issue in my project too. Any solution for this?
Thanks
Meera
How to define the paperSize in the onPDFExport function? Currently getting the error unknown paperSize. Variable width is the total width of all of the columns in the grid, and it is not undefined.
Current code:
function onPDFExport(e) {
var grid = $("#CustomerOrderYearlyAllGrid").data("kendoGrid");
var width = 0;
for (var i = 0; i < this.columns.length; i++) {
this.autoFitColumn(i);
width = width + this.columns[i].width;
}
debugger;
var CustomerID = $("#CustomerID").data('kendoDropDownList');
var selectedCustomerName = CustomerID.text();
grid.options.pdf.fileName = selectedCustomerName + " Summary (Yearly).pdf";
grid.options.pdf.paperSize = (width + "px","500px");
}
I'm using .paperSize("auto") for my Export to PDF, and I want using the .TemplateId("templateName") so that I could include a header when I export to PDF. Using paperSize("auto") will not apply the template. How do I use paperSize("auto") and also include a header? Any help with be appreciated
<script type="x/kendo-template" id="page-template">
<div class="page-template">
<div class="header">
#=getDllValueForPrint()#
</div>
<div class="footer">
@*<div style="float: right">Page #: pageNum # of #: totalPages #</div>*@
</div>
</div>
</script>
.Pdf(pdf => pdf
.FileName("Customer Orders Summary (Yearly).pdf")
.AllPages()
.PaperSize("auto")
.Margin("2cm", "1cm", "1cm", "1cm")
.Landscape()
.TemplateId("page-template")
function getDllValueForPrint() {
var CustomerID = $("#CustomerID").data('kendoDropDownList');
var selectedCustomerName = CustomerID.text();
return selectedCustomerName;
}