stream a byte[] to load inside a jquery modal as P

Question

I am trying to stream a byte[] to load inside a jquery modal when a certain link is clicked using MVC3. In my controller I have

public ActionResult GetTermsAndCondtion()
        {
            byte[] termsPdf = GetTermsAndConditions(DateTime.Now);              
            return new FileContentResult(termsPdf, "application/pdf");
        }

In one of my view I have

@Html.ActionLink("Terms and Conditon","GetTermsAndCondtion","Customer", new{id="terms"})

This opens the pdf file in a tab. But I want to open the byte[] as pdf file inside a modal.

Any Help?

Answer 1

Iframe could be your answer.

The problem it's that ajax can't load the pdf it inside the browser, to show a pdf you must specified the content disposition and the browser show the pdf inside him

to specified the content disposition add header

HttpContext.Response.AddHeader("content-disposition", "inline; filename=MyFile.pdf")
Return File(fileStream, "application/pdf")

Controller

public ActionResult GetTermsAndCondtion()
        {
            byte[] termsPdf = GetTermsAndConditions(DateTime.Now);
            HttpContext.Response.AddHeader("content-disposition", "inline; filename=MyFile.pdf");

            return File(termsPdf, "application/pdf");
        }

And finally add this iframe inside your modal

<iframe src="@url("GetTermsAndCondtion","NameOfYourController")" width="400" height="500" scrolling="auto" frameborder="1">
</iframe>

Answer 2

Here's a solution [to view/print/save a PDF], that generates the PDF modal dialog from a byte[] via an MVC-ajax call. It is built from a number of other semi-related posts elsewhere. There are two options: PrintDialog1 uses the object tag, were as PrintDialog2 uses iframe tag.

Controller >>

[Post]
public ActionResult DoSomethingThatResultsInCreatingAPdf(CreatePaymentViewModel model)
{
  byte[] pdf = DoSomethingThatResultsInCreatingAPdfByteArray();
  string strPdf = System.Convert.ToBase64String(pdf);
  var returnOjb = new { success = true, pdf = strPdf, errors = "" ...otherParams};
  return Json(returnOjb, JsonRequestBehavior.AllowGet);
} 

Razor page >>

  <div id="PrintPopup"></div>

<script type="text/javascript">

  function DoSomethingThatResultsInCreatingAPdf(btn, event) { 
    event.preventDefault();
    var action = '/Controller/DoSomethingThatResultsInCreatingAPdf/';
    $.ajax({
      url: action, type: 'POST', data: some_input_data,
      success: function (result) {
        if (result.success) {
            PrintDialog-1or2(result.pdf);
        }else{ $('#errors').html(result.errors); }
      },
      error: function () {}
    });
    }//___________________________________

  function PrintDialog1(pdf) { //<object tag>
    var blob = b64StrtoBlob(pdf, 'application/pdf'); 
    var blobUrl = URL.createObjectURL(blob);
    var content = String.format("<object data='{0}' class='ObjViewer'></object>", blobUrl);
    $("#PrintPopup").empty();
    $("#PrintPopup").html(content);
    $("#PrintPopup").dialog({
      open: true, modal: true, draggable: true, resizable: true, width: 800, position: { my: 'top', at: 'top+200' }, title: "PDF View, Print or Save...",
      buttons    : {'Close': function () { $(this).dialog('close'); }}
    });
    return false;
  }//___________________________________

  function PrintDialog2(pdf) { //<iframe tag>
    var content = "<iframe src='data:application/pdf;base64," + pdf + "'></iframe>";
    $("#PrintPopup").empty();
    $("#PrintPopup").html(content);
    $("#PrintPopup").dialog({
      open: true, modal: true, draggable: true, resizable: true, width: 800, position: { my: 'top', at: 'top+200' }, title: "PDF View, Print or Save...",
      buttons    : {'Close': function () { $(this).dialog('close'); }}
    });
    return false;
  }//___________________________________

  String.format = function () {
    var s = arguments[0];
    for (var i = 0; i < arguments.length - 1; i++) {
      var reg = new RegExp("\\{" + i + "\\}", "gm");
      s = s.replace(reg, arguments[i + 1]);
    }
    return s;
  }//___________________________________

  function b64StrtoBlob(b64Data, contentType, sliceSize) {
    contentType = contentType || '';
    sliceSize = sliceSize || 512;
    var byteCharacters = atob(b64Data);
    var byteArrays = [];
    for (var offset = 0; offset < byteCharacters.length; offset += sliceSize) {
      var slice = byteCharacters.slice(offset, offset + sliceSize);
      var byteNumbers = new Array(slice.length);
      for (var i = 0; i < slice.length; i++) {
        byteNumbers[i] = slice.charCodeAt(i);
      }
      var byteArray = new Uint8Array(byteNumbers);
      byteArrays.push(byteArray);
    }
    var blob = new Blob(byteArrays, {type: contentType});
    return blob;
  }//___________________________________