Creating Downloadable PDF in ASP.NET With Client Side Event Call

Scenario : There will be a button, when user clicks it, a dialog box will open that provides user with two options, either user can directly view or save the pdf file in his/her local machine. The pdf will contain all the details of a perticuler user whose first and last name will be given in textbox.

As there is a scenario of getting data from db and it will be a client side call then using jquery.ajax() and calling a service (either written in WCF or asmx) from it is the best option.

But what is the problem ?
To create a downloadble pdf file we have to mention the HTTP response header to browser in order to show the dialog to open or save a file. The response header is something like this,

HttpResponse Response = HttpContext.Current.Response;
Response.ContentType = "application/pdf";
Response.AddHeader("Content-Disposition", "attachment; filename="Sample.pdf");
Response.BinaryWrite(output.ToArray());

But in case of jqery.ajax() we also have to mention the response header (i.e contentType) in order to fetch the data properly from the service. In this case both these two type of response header get clashed somehow and you will get some unformatted data and the dialog will never come.
So what’s the solution ?
There is a bypass way to call a method of server side from client side. We can use jquery’s submit() method to call an aspx page. So we can write all our db retrieval code and HTTP response header in a code-behind and reirect the control to this page with jquery.click() function. Somehow like following,

jquery("#id").click(function(){

   openPdf('ShowPdf.aspx', 'filename=Sample.pdf&FirstName='+txtFname.val()+'&LastName='+txtLastName.val(), 'POST');
});
 
openPdf() method have three aruments,
URL - its is the filename in which all our code is written and this will be called.
Data - Different attribute sepeared by '&' and the attributes are of 'name=value' pair format
Method - typically POST

Bellow is the defination of openPdf() method,

function OpenPDF(aUrl, aData, aMethod) {
    var inputs = '';
     jquery.each(aData.split('&'), function() {
          var pair = this.split('=');
          inputs += '';
      });
     
      jquery('' + inputs +          '').appendTo('body').submit().remove();
 return false;
}

First it’s taking the data, splited it by ‘&’ and creates hidden field with the name=value pair and then creates the tag as follows,

Then using jquery.submit() we can submit the value, and we can easilly grab those values in ShowPdf.aspx as follows,

string DocumentName = Request.Params["filename"].ToString();
string FristName = Request.Params["FirsttName"].ToString();
string LastName = Request.Params["LastName"].ToString();

So, we have the filename, required parameter to call the method that will retrive the necessary data to populate the pdf. Now use iTextSharp.dll to create the pdf file use the above HTTP response header to make it downloadable.

This will may help you.. Download iTextSharp.dll  – sourceforge.net/projects/itextsharp/

Using itextSharp to create pdf document in ASP.NET – www.4guysfromrolla.com/articles/030911-1.aspx, www.martinwilley.com/net/code/createpdf.html

Note :
Not only pdf file, this approach can be applied to create downloadable file of any time. Only change in ContentType field will be needed, for example if you want to create downloadable CSV (Comma Separated Values) file, the ContentType may looks like following,

Response.ContentType = "text/x-comma-separated-values";

For complete list of ContentType for diffferent file type you may look into the link – en.wikipedia.org/wiki/Mime_type