Load PDFViewer from POST endpoint passing data in the body

0 Answers 397 Views
PDFViewer
Michel
Top achievements
Rank 1
Iron
Michel asked on 28 Dec 2022, 02:36 PM

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.
        }

No answers yet. Maybe you can help?

Tags
PDFViewer
Asked by
Michel
Top achievements
Rank 1
Iron
Share this question
or