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?
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>
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;
}//___________________________________