Solved

Response.TransmitFile not opening Save dialog

Posted on 2016-08-02
15
76 Views
Last Modified: 2016-08-06
Hi. I have a button that calls an Angular function that makes an http post call. Inside my C# a file is created on the server. I then want to download it to the client with Response.TransmitFile(), but it doesn't work.

HTML:
<button style="width: 140px;" ng-click="Export()" class="btn btn-default btn-vk">EXPORT</button>

Open in new window


Angular:
var request = $http.post(baseSiteUrlPath + 'DistributionData/Export', { requestData: requestData });

Open in new window


C#:
System.Web.HttpResponse response1 = System.Web.HttpContext.Current.Response;
response1.AddHeader("Content-Disposition", "attachment; filename=hardus.xlsx");
response1.ContentType = "application/vnd.openxmlformats-officedocument.spreadsheetml.sheet";
response1.TransmitFile(@"D:\Hardus\hardus.xlsx");
response1.End();

Open in new window


This code pretty much does nothing. No dialog. The file just lies on the server.
0
Comment
Question by:Hardus Lombaard
  • 5
  • 4
  • 2
  • +2
15 Comments
 
LVL 8

Accepted Solution

by:
Mohit Vijay earned 250 total points
Comment Utility
IF you change few lines in javaScript, it will work for you

Instead of
var request = $http.post(baseSiteUrlPath + 'DistributionData/Export', { requestData: requestData });

use
window.open(baseSiteUrlPath + 'DistributionData/Export', { requestData: requestData });
0
 

Author Comment

by:Hardus Lombaard
Comment Utility
Thanks. But it doesn't seem (according to http://www.w3schools.com/jsref/met_win_open.asp) that window.open can be used to send through parameters to an mvc controller. I need to pass a JSON object through. Any help?
0
 
LVL 51

Expert Comment

by:Julian Hansen
Comment Utility
What do you see in the console when you click the button
Is the request being generated
Are there any errors
Is there anything in the Response tab of the POST?
0
 
LVL 8

Expert Comment

by:Prakash Samariya
Comment Utility
Can you reply with your code snap to give answer?
Is your angularJS code runs and calls "Export" function?
Is back-end C# code calls?
Is it giving any output or errors? (snapshot please)

Please describe more in question to reply answer properly
0
 
LVL 27

Expert Comment

by:BigRat
Comment Utility
The C# code is sending an Excel file (looks like Open Office) as an attachment with a mime-type of "application/*". A normal browser would open a "SaveAs" dialog to save the file. The request object of Angular however does not have this functionality.

The question arises as to what you want to do with the file? If it is to save locally then the suggestion by Mohit Vijay applies. If it is to be displayed on the page, then the file needs to be converted to JSON format, the C# code should not add an "attachment" header and the mime type should be set to "application/json". Then the fun starts as to how you are going to represent the file in some sort of grid.
0
 
LVL 8

Expert Comment

by:Mohit Vijay
Comment Utility
Hello,

You can use model window (window.open same) to pass parameters (complex object like json), but in that case it will not be pure MVC. You have to catch those parameters in in download view or page using javascript and then consume it. (eg. store those values using javascript into hidden control as runnat=server)

If you want to work with mvc, then try to use FileActionResult, it will work , but not same as above you stated.
0
 

Author Comment

by:Hardus Lombaard
Comment Utility
To answer BigRat: All I want to do is to save the file locally. So a "SaveAs" dialog suffices. But I need to pass parameters through to my C# Export method, because the server makes a call to the database to retrieve information. This information is then put into the Excel file that I want to download to the client.

My C# method definition:
public ActionResult Export (List<int> statuses, DateTime? month, string importerName)
{
}

Open in new window


My Angular:
window.open(baseSiteUrlPath + 'DistributionData/Export');

Open in new window


So the question is how I must adjust my angular code to send the parameters through.

Thanks for the help.
0
How to run any project with ease

Manage projects of all sizes how you want. Great for personal to-do lists, project milestones, team priorities and launch plans.
- Combine task lists, docs, spreadsheets, and chat in one
- View and edit from mobile/offline
- Cut down on emails

 
LVL 27

Expert Comment

by:BigRat
Comment Utility
Could you tell me what "requestData" is?

Basically it's going to be window.open with a IRL which contains the requestdata as Parameters.
0
 

Author Comment

by:Hardus Lombaard
Comment Utility
requestData basically is the object that I want to pass though. Here is how it looks:
var requestData =
{
       "statuses": $scope.selStatuses,
       "month": ($scope.FilterGrid.Month != undefined ? $scope.FilterGrid.Month.label : undefined),                
       "importerName": $scope.FilterGrid.ImporterName
};

Open in new window


statuses will be a list (or array) of numbers. Look at my C# definition above to see how these parameters are received on the server side.
0
 
LVL 27

Expert Comment

by:BigRat
Comment Utility
Unfortunately I'm no good at C#, so I'm not certain what a List<int> would look like when represented as a simple URL (Name repeated lots of times? And what Name?) ImporterName and month should be straight forward when contructing the bit that goes ?month=10&importedName=John%20Doe&...
So you Need to make up a URL string and the assign that to window.location.

It's time for Rat's cheese now.
0
 
LVL 51

Expert Comment

by:Julian Hansen
Comment Utility
All I want to do is to save the file locally
Unfortunately you can't do this using AJAX - due to security constraints scripting does not have access to write to the local drive.

What you can do is generate the file on the server and send back a URL to the file then redirect the browser to that file. If you set the content type correctly the file save dialog will open and the page will not redirect away.

You can also take a look at this library https://github.com/eligrey/FileSaver.js/
It basically creates a link dynamically and inserts the returned data as a BLOB, triggers a click on the link which has the same effect.

window.location.href=response.url;
0
 

Author Comment

by:Hardus Lombaard
Comment Utility
So on the server I create the file:
FileInfo newFile = new FileInfo(@"D:\ClientWebsites\BSWVAT404_Test\BSWVAT404_Test\hardus.xlsx");

Open in new window

"BSWVAT404_Test" is my Application directory, hosted in IIS.

Then I need to set the content type for "hardus.xlsx". Not sure how to do this.
Then I need to create the URL for the file. Is my following code correct?:
var url = Url.Content("~/BSWVat404_Test/hardus.xlsx");

Open in new window

or should it be
var url = Url.Content("~/hardus.xlsx");

Open in new window

0
 
LVL 27

Assisted Solution

by:BigRat
BigRat earned 250 total points
Comment Utility
Don't understand. Your C# code is good for transmitting the file. It is just a matter of getting the correct URL to send to get it and this URL as a string is assigned to window.location.href.
0
 
LVL 8

Expert Comment

by:Prakash Samariya
Comment Utility
Try below code
//Create File and get FileInfo
FileInfo newFile = new FileInfo(@"D:\ClientWebsites\BSWVAT404_Test\BSWVAT404_Test\hardus.xlsx");

//Set  content type for downloading file
Response.AddHeader("content-disposition", "attachment;filename="+newFile.Name );
Response.ContentType = "application/vnd.xls"
Response.Charset = "";
Response.TransmitFile(newFile.Name);
Response.Flush();
Response.Close();
Response.End();

Open in new window

0
 

Author Closing Comment

by:Hardus Lombaard
Comment Utility
Thanks for everybody that contributed to this post. Got it working finally.
0

Featured Post

How to run any project with ease

Manage projects of all sizes how you want. Great for personal to-do lists, project milestones, team priorities and launch plans.
- Combine task lists, docs, spreadsheets, and chat in one
- View and edit from mobile/offline
- Cut down on emails

Join & Write a Comment

It was really hard time for me to get the understanding of Delegates in C#. I went through many websites and articles but I found them very clumsy. After going through those sites, I noted down the points in a easy way so here I am sharing that unde…
This article describes how to create custom column layout styles for Bootstrap. The article uses 5 columns to illustrate the concept, but the principle can be extended to any number of columns.
In this tutorial viewers will learn how to define a gradient in CSS. Create a new HTML document with an internal stylesheet.: Create a div in CSS and name it Gradient. Define the background as "linear-gradient(to right, #ee3668, black)". Ensure you …
In this tutorial viewers will learn how to embed videos in a webpage using HTML5. Ensure your DOCTYPE declaration is set to HTML5: "<!DOCTYPE html>": Use the <video> tag to insert a video. Define the src as the URL of your video; this is similar to …

772 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question

Need Help in Real-Time?

Connect with top rated Experts

10 Experts available now in Live!

Get 1:1 Help Now