display inline document on partial page on ajax.action link - asp.net-mvc-2

Question

I am calling an ajax.action link on a page. This will display the name of the document. While i click on the document, an ajax request is fired tot he controller, which will return a File Content Result and I want this file to be shown inline in the browser under the targetID div.
Code - bytestream = fs.ToArray();
fs.Close();
Response.AppendHeader("Content-Disposition", String.Format("inline; filename={0}", fileName));
return File(bytestream, "application/pdf");
The problem is , the file is displayed as the stream and it is not displying the contents correctly.
<legend>Document</legend>
<% if (Model.PresentDocument != null)
{ %>
<li><%: Ajax.ActionLink(Model.PresentDocument, "GetDocumentPage", new RouteValueDictionary(new { controller = "Document", action = "GetDocumentPage", id = Model.PresDocId }), new AjaxOptions { HttpMethod = "Post", UpdateTargetId = "Document" })%></li>
<%} %>
<div id="Document">
</div>
Do i need to do anything specific for this div to display the inline pdf?

Answer 1

You cannot use AJAX to download files. One possible way to achieve this is to have a normal link and when this link is clicked use javascript to dynamically generate an iframe and point the iframe source to the controller action:
<%= Html.ActionLink(
Model.PresentDocument,
"GetDocumentPage",
"Document",
new { id = Model.PresDocId },
new { id = "displayPdf" }
) %>
which is you could AJAXify like this (using jQuery):
$(function() {
$('#displayPdf').click(function() {
$('#Document').html(
$('<iframe/>', {
src: this.href,
width: '300px',
height: '150px'
})
);
return false;
});
});
which assumes that your controller action is accessible through GET requests:
public ActionResult GetDocumentPage(string id)
{
byte[] pdf = ...
Response.AppendHeader("Content-Disposition", String.Format("inline; filename={0}", fileName));
return File(pdf, "application/pdf");
}