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 have a grid which needs to have some conditional formatting on certain cells. I have achieved this via the model, and a client template, which does work.
The style is passed as a field to the client template.actl3.Bound(o => o.QualifiedNight_Actual).Title("Registered Nurse/Nursing Associate").HeaderHtmlAttributes(new { style = "text-align: center; justify-content: center;overflow: visible !important;white-space: normal !important;" }).ClientTemplate("<div class=#=QualifiedNightColour#>#=QualifiedNight_ActualText#</div>");
The style is
.stWarning {
background-color: red;
width: 100%;
}
However, there is still padding around the div which remains a different colour. How can I make the entire cell have the desired background colour? I did try applying negative margins to the style, but this only seemed to work for the left side of the cell.
As just using the client template works well apart from this, I'm really not keen on having to add more JavaScript code for this (as there are nine fields in the grid that need this applying).
Thanks
I have an issue with my page where everything works fine except it will not go to pages 3, 5, and 11. My datasource is a list of an object in my model. I can add, save, anything except go to those pages. Below is my code from the page. I am using Kendo 2020.3.1118 (don't have a license for anything newer). If I click on the 3, nothing happens if I am on page 2 and click the next page arrow, nothing happens. If I am on page 4 and click the next page arrow nothing happens. But if I am on page 6 and click it, I go to 7, then 8, etc. until I get to 10. It only refuses those 3 pages out of the 12 that it creates for my data. The counter on the bottom right works fine. And if I take out the pageable ability, my dropdown quits working. I have only been using Kendo for about a week or so. Once I get this figured out, this project will actually be complete. It is the last issue I have to solve. Any help would be greatly appreciated.
@(Html.Kendo().Grid(Model).Name("EditableGrid")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?
I've just started a new project and used the latest release of the framework (v2022.3.1109). Unfortunately I've encountered some issues which didn't appear using earlier versions of the framework (pre R1 2022 I believe).
The problems are
Is there any documentation detailing the changes from R1 2022 and how to achieve these relatively simple appearance changes?
I'm using bootstrap 5 and the kendo.bootstrap-nordic.min.css css file.
Thanks
Hello, i came accross this article
which says you can create a PDF/A3 format document but not the embedding. When would be feature available?
Regadrs,
Geetha
I'm working on a new project using version v2022.3.1109. There seems to have been a change of behavior since the last version I used. When a call to a grids datasource read method fails, the grid isn't cleared of data, as used to be the case.
This can give a user the impression the call has worked. I can trap data source errors, but there doesn't seem to be a method to clear the current data from the grid.
What's the easiest way to clear the datasource if a read call fails?
The read call looks like:
$("#Grid").data("kendoGrid").dataSource.read();
Thanks
I just performed an upgrade of our Telerik UI for MVC from version 2021.1.119.545 to 2022.3.1109 via the Upgrade Wizard on the VS 2022 Telerik extension. But now some of the javascript code is not working properly, in particular the tabStrip disable function. Here is an example of the code that previously worked fine...
var tabStrip = $("#formTabStrip").kendoTabStrip().data("kendoTabStrip");
tabStrip.disable(tabStrip.tabGroup.children().eq(5)); <== no longer works after upgrade
Any idea why this may be happening?
Thanks!
Hello,
I am Kendo Grid in MVC
The grid is set up for in-cell batch editing. One of the fields is a date field. If the date is selected using date picker the value stays in the cell, whereas if the date value is manually entered the value does not hold in the cell. Any suggestions why the value is not holding in the cell when manually entered.
Thank you