Question

I’ve got a page that’s being used to display a report with an Ajax form. I would like to allow the user to pick if they would like the report in HTML, CSV or some other downloadable format. The HTML portion is working fine but when I try to download the CSV version the contents of the file is being displayed on the page instead of prompting the user to download.

If I change the form so it’s no longer an Ajax form the file download works but then displaying the HTML version isn’t as nice. Is there a way to do what I’m trying?

My controller has code like so:

switch (reportType)
{
  case ReportType.Csv:
    return File(reportDataAsBytes, "text/csv", "report.csv");
  default:
    return PartialView("DisplayAllOrders", reportData);
}

And this is in my view

@using (Ajax.BeginForm("ViewAllOrders", "Report", new AjaxOptions { UpdateTargetId = "reportContent", InsertionMode = InsertionMode.Replace }))
{
  Format:
  <select id="ReportType" name="ReportType">
    <option value="1">HTML</option>
    <option value="2">CSV</option>
  </select>
  <input type="submit" />
}

Answer 1

You cannot use AJAX to cause file download from the main HTML response.

A common way to overcome this is to use an invisible IFrame… tell the AJAX call to refresh the IFrame and set the IFrame’s src to the file you want to send in its load event.