How to Get CSV File to Download on Ie? Works on Firefox

How do I get csv file to download on IE? Works on firefox

Don't we love IE? :)

Try using those headers:

  header("Pragma: public");
  header("Expires: 0");
  header("Cache-Control: must-revalidate, post-check=0, pre-check=0");
  header("Cache-Control: private",false);
  header("Content-Type: application/octet-stream");
  header("Content-Disposition: attachment; filename=\"exportevent.csv\";" );
  header("Content-Transfer-Encoding: binary");

I think that the octet-stream content type forces IE to download the file.

(Angular) Need help to download a cvs file in IE, it works on Chrome and Firefox

I don't know how you download the csv file as you don't show it in your example code. But I think the error is due to you're using some methods not supported by IE.

IE has its own API for creating and downloading files, which is called msSaveBlob or msSaveOrOpenBlob. You should use one of them to download files. The difference between the msSaveBlob and msSaveOrOpenBlob methods is that the former only provides a Save button to the user whereas the latter provides both a Save and an Open button.

If you have the blob data, you can use the API like this:

if(window.navigator.msSaveOrOpenBlob) {
    //IE11 & Edge, download function
    window.navigator.msSaveOrOpenBlob(blob, fileName); 
}
else{
   //Other browsers, your download function        
    ...
}

You can also refer to this thread and this thread for more information.

Download and open CSV in Excel works in Chrome and Firefox but not IE or Edge

IE is always fun! I had run into this issue previously so I looked back to see what I'd done. Here's the snippet I have:

var blob = new Blob([csvFile], { type: 'text/csv;charset=utf-8;' });
if (navigator.msSaveBlob) { // IE 10+
    navigator.msSaveBlob(blob, filename);
} else {
    var link = document.createElement("a");
    if (link.download !== undefined) { // feature detection
        // Browsers that support HTML5 download attribute
        var url = URL.createObjectURL(blob);
        link.setAttribute("href", url);
        link.setAttribute("download", filename);
        link.style.visibility = 'hidden';
        document.body.appendChild(link);
        link.click();
        document.body.removeChild(link);
    }
}

It looks for the IE 10+ function 'navigator.msSaveBlob' and if found, uses that to save the blob. Otherwise, it uses similar logic to what you posted for any other browser.

IE displays the csv file instead of downloading

You could try to add mime-mapping to your web.xml

<mime-mapping> 
  <extension>csv</extension>
  <mime-type>application/octet-stream</mime-type> 
</mime-mapping>

Javascript CSV file download issue in FireFox, works in Chrome

You are creating an element and invoking the click event of the
element without adding the same to the DOM. That's
why it's not working in FireFox.

I created a hidden div <div id="container" style="display:none;"></div> and appended the hiddenElement you created to this div then trigger the click event which is now causing FireFox to download the csv.

That's it :-)

I tested in FireFox and Chrome and both are looking good.

Modified code:

<!DOCTYPE html><html><head>  <meta charset="utf-8" />  <title></title>  <script type="text/javascript" src="http://code.jquery.com/jquery-latest.min.js"></script></head><body>
    <script>
        var data = [           ['idea', 'a very good one'],           ['beer', 'not when driving'],           ['guitar', 'yes please']        ];

        function download_csv() {            var csv = 'Name,Title\n';            data.forEach(function(row) {                    csv += row.join(',');                    csv += "\n";            });
            console.log(csv);            var hiddenElement = document.createElement('a');            hiddenElement.href = 'data:text/csv;charset=utf-8,' + encodeURI(csv);            hiddenElement.target = '_blank';            hiddenElement.download = 'test.csv';            document.getElementById('container').appendChild(hiddenElement);            hiddenElement.click();        }
    </script>
    <button onclick="download_csv()">Download CSV</button>    <div id="container" style="display:none;"></div></body></html>

JavaScript code works for downloading csv in FireFox but not Microsoft Edge

Fixed.
The issue(as always it seems when I am dealing with while trying to pass data(text) via URI using Microsoft Browsers) that are at or exceeds ~5kb. We can bypass this ridiculous limitation via constructing a URI for a binary resource instead of a text resource.

Replaced this block of code :

   element.setAttribute('href', 'data:text/csv;charset=utf-8,' + encodeURIComponent(csvStr));
   element.setAttribute('download', 'FOOBAR.csv');

   element.style.display = 'none';
   document.body.appendChild(element);

   element.click();

   document.body.removeChild(element);

with this block of code:

let blob = new Blob(
      [ csvStr ],
      {
      type : "data:text/csv;charset=utf-8"
      }
      );

      const linkElement = document.createElement('a');
      const url = URL.createObjectURL(blob);
      linkElement.setAttribute('href', url);
      linkElement.setAttribute('download', 'policy_information.csv');
      const clickEvent = new MouseEvent('click', {
        'view': window,
        'bubbles': true,
       'cancelable': false
      });
      linkElement.dispatchEvent(clickEvent);```

Download File From Server on Firefox and IE

Remove the checks for IE and Firefox.

Updated version:

function downloadFile(sUrl) {  //iOS devices do not support downloading. We have to inform user about this.  if (/(iP)/g.test(navigator.userAgent)) {    // alert('Your device does not support files downloading. Please try again in desktop browser.');    window.open(sUrl, '_blank');    return false;  }
  //Creating new link node.  var link = document.createElement('a');  link.href = sUrl;  link.setAttribute('target','_blank');
  if (link.download !== undefined) {    //Set HTML5 download attribute. This will prevent file from opening if supported.    var fileName = sUrl.substring(sUrl.lastIndexOf('/') + 1, sUrl.length);    link.download = fileName;  }
  //Dispatching click event.  if (document.createEvent) {    var e = document.createEvent('MouseEvents');    e.initEvent('click', true, true);    link.dispatchEvent(e);    return true;  }
}