Dowload button not working on Internet Explorer

Question

I am working on thymeleaf and in my code i have a download button which triggers the javascript function. The button is working well on chrome but not on Internet Explorer.

Javascript code:

function Download(containerid) {
        var fileName =  'tags.txt';
            var elHtml = document.getElementById(containerid).innerHTML;
            var link = document.createElement('a');
            mimeType = 'text/html' || 'text/plain';
            link.setAttribute('download', 'ApiResponse.txt');
            link.setAttribute('href', 'data:' + mimeType + ';charset=utf-8,' + encodeURIComponent(elHtml));
            link.click(); 
        }

HTML from where it is being called:

<div class="tooltipp">
    <img onclick="Download('responseMessageEndpoint')"
    style="width: 20px; height: 20px;" th:src="@{css/download.jpg}" />
    <span class="tooltiptextt">Download</span>
</div>

From what i have googled, download.createElement('a') is not being supported by IE. But i am not able to fine a good workaround.

Thanks in advance!

Answer 1

The IE browser not support the Download attribute . You could try to use msSaveOrOpenBlob method to download the file in IE browser.

Try to use the following code:

<script>
    function Download(containerid) {
        var returnedData = document.getElementById(containerid).innerHTML;
        var filename = "hello.txt";
        var BOM = "\uFEFF"; 

        if (navigator.msSaveBlob) {                // ie block
            console.log("found msSaveBlob function - is't IE")
            var blobObject = new Blob([BOM + returnedData], { type: ' type: "text/plain;charset=utf-8"' });
            window.navigator.msSaveOrOpenBlob(blobObject, "hello.txt");
        }
        else {                                     // non-ie block
            console.log("not found msSaveBlob function - is't not IE")
            var a = window.document.createElement('a');
            a.setAttribute('href', 'data:text/plain; charset=utf-8,' + encodeURIComponent(BOM + returnedData));
            a.setAttribute('download', 'hello.txt');
            a.click();
        }
    }
</script>