IE download file
html, internet-explorer, javascript, jquery
Solution
Download attribute is NOT supported in IE and iOS Safari
IE<10:
Command SaveAs using execCommand can do the trick, by making element's contents downloadable.
Cons:
- Problems in some versions of IE running on Win7 [I don't know if it's fixed Here]
- Need a DOM element to contain data
IE>=10
Using msSaveBlob, it's a method that allows to save Blob or File by sending this headers:
Content-Length: <blob.size>
Content-Type: <blob.type>
Content-Disposition: attachment;filename=<defaultName>
X-Download-Options: noopen
Check Saving files locally using Blob and msSaveBlob
Cons:
- Need a to define a Blob
Other browsers
If you don't want to implement all that by yourself, there is a nice library FileSaver.js to save generated files on client side. It supports Firefox, Chrome, Chrome for Android, IE 10+, Opera and Safari. For IE<10 there is a fork of the library that adds saveTextAs to save text files (.htm, .html, .txt)
Cross browsers solution
A server side script that receives filename, data, meme type then send the file with the header `Content-Disposition: attachment; filename=FILENAME`
Problem
Using the following lines of code I am able to download a file in the response of a Ajax call in Firefox, Chrome, Opera. However in IE the `href` attribute `download` is not supported. Therefore the below does not work in IE. HTML: ``` <div class="fRight" style="margin-left:5px; margin-rigth:5px" > <input type="button" value="Request File" id = "chReqFileBtn" onclick = "handleClick"/> <a href="#" id="challengeReqFileAnchor" style="visibility: hidden"></a> </div> ``` JavaScript: ``` function handleClick() { var code = $('#code').val(); var quantity = $('#quantity').val(); var req = $.ajax( { 'type': 'POST', 'url' : $apiBasePath+'config/challenge-file', contentType : 'application/json', 'data': JSON.stringify({'code':code, 'quantity':quantity}), 'success':function(response, status, xhr) { var code = xhr.getResponseHeader('Operation-Code'); var anch = $('#challengeReqFileAnchor'); anch.attr( { "download" : 'request.bin', "href" : "data:text/plain," + response }); anch.get(0).click(); }, 'error': function(request,status,errorThrown) { ...... } }); $pendingReqs.push(req); } ``` What options would I have to accomplish the same behavior in IE as well?