web-dev-qa-db-fra.com

Javascript/jQuery: L'exportation de données au format CSV ne fonctionne pas IE

Je dois exporter les données affichées dans un tableau au format CSV. J'ai essayé beaucoup de choses, mais je ne pouvais pas le faire fonctionner pour IE 9 et plus.

J'ai créé un violon factice avec mon code.

var data = [
    ["name1", "city1", "some other info"],
    ["name2", "city2", "more info"]
];//Some dummy data

var csv = ConvertToCSV(data);//Convert it to CSV format
var fileName = "test";//Name the file- which will be dynamic

if (navigator.userAgent.search("MSIE") >= 0) {
    //This peice of code is not working in IE, we will working on this
    //TODO
    var uriContent = "data:application/octet-stream;filename=" + fileName + '.csv' + "," + escape(csv);
    window.open(uriContent + fileName + '.csv');
} else {
    var uri = 'data:text/csv;charset=utf-8,' + escape(csv);
    var downloadLink = document.createElement("a");
    downloadLink.href = uri;
    downloadLink.download = fileName + ".csv";
    document.body.appendChild(downloadLink);
    downloadLink.click();
    document.body.removeChild(downloadLink);
}

J'ai vu beaucoup de liens dans Stackoverflow, mais je n'ai rien trouvé qui fonctionne avec IE9 ou une version ultérieure. Comme @ Terry Young explique comment exporter les données en csv en utilisant jquery ou javascript

Aussi, essayé

var csv = ConvertToCSV(_tempObj);
        var fileName = csvExportFileName();
        if (navigator.appName != 'Microsoft Internet Explorer') {
            window.open('data:text/csv;charset=utf-8,' + escape(str));
        }
        else {
            var popup = window.open('', 'csv', '');
            popup.document.body.innerHTML = '<pre>' + str + '</pre>';
        }

Je ne suis pas sûre de pouvoir régler ça. Je ne veux pas frapper le serveur et exporter mon fichier CSV (l'exigence l'indique).

javascriptexport-to-csv
18
Shubh

Après avoir utilisé Javascript, cela résoudra votre problème.

Utilisez ceci pour IE,

var IEwindow = window.open();
IEwindow.document.write('sep=,\r\n' + CSV);
IEwindow.document.close();
IEwindow.document.execCommand('SaveAs', true, fileName + ".csv");
IEwindow.close();

Pour plus d’informations, j’ai écrit un tutoriel à ce sujet, voir - Télécharger des données JSON au format CSV Prise en charge de plusieurs navigateurs

J'espère que cela vous sera utile.

16
inaam husain

Pour IE 10+, vous pouvez effectuer les tâches suivantes:

var a = document.createElement('a');
        if(window.navigator.msSaveOrOpenBlob){
            var fileData = str;
            blobObject = new Blob([str]);
            a.onclick=function(){
                window.navigator.msSaveOrOpenBlob(blobObject, 'MyFile.csv');
            }
        }
        a.appendChild(document.createTextNode('Click to Download'));
        document.body.appendChild(a);

Je ne crois pas que cela soit possible dans les versions antérieures d'IE. Sans appeler l'objet activeX, mais si cela est acceptable, vous pouvez utiliser:

var sfo=new ActiveXObject('scripting.FileSystemObject');
var fLoc=sfo.CreateTextFile('MyFile.csv');
fLoc.WriteLine(str);
fLoc.close();

Ce qui écrirait le fichier directement dans le système de fichiers de l'utilisateur. Cela invitera toutefois généralement l'utilisateur à demander s'il souhaite autoriser l'exécution du script. L'invite peut être désactivée dans un environnement intranet.

6
Adam Matthews

C’est aussi l’une des réponses que j’ai utilisées et qui fonctionne très bien pour IE - 10+ versions:

var csv = JSON2CSV(json_obj);            
var blob = new Blob([csv],{type: "text/csv;charset=utf-8;"});

if (navigator.msSaveBlob) { // IE 10+
navigator.msSaveBlob(blob, "fileName.csv")
    } 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.csv");
            link.style = "visibility:hidden";
            document.body.appendChild(link);
            link.click();
            document.body.removeChild(link);
        }           
    }

J'espère que cela t'aides.

4
arunsingh

J'ai la solution qui prend en charge IE 8+ pour moi. Nous devons spécifier le séparateur comme indiqué ci-dessous.

if (navigator.appName == "Microsoft Internet Explorer") {    
    var oWin = window.open();
    oWin.document.write('sep=,\r\n' + CSV);
    oWin.document.close();
    oWin.document.execCommand('SaveAs', true, fileName + ".csv");
    oWin.close();
  }

Vous pouvez passer par le lien http://andrew-b.com/view/article/44

4
user3679149

utilisez l'objet Blob Créez un objet blob et utilisez msSaveBlob ou msSaveOrOpenBlob Le code fonctionne dans IE11 (non testé pour les autres navigateurs).

    <script>


 var csvString ='csv,object,file';
    var blobObject = new Blob(csvString); 

        window.navigator.msSaveBlob(blobObject, 'msSaveBlob_testFile.txt'); // The user only has the option of clicking the Save button.
        alert('note the single "Save" button below.');

        var fileData = ["Data to be written in file."];
    //csv string object inside "[]"
        blobObject = new Blob(fileData);
        window.navigator.msSaveOrOpenBlob(blobObject, 'msSaveBlobOrOpenBlob_testFile.txt'); // Now the user will have the option of clicking the Save button and the Open button.`enter code here`
        alert('File save request made using msSaveOrOpenBlob() - note the two "Open" and "Save" buttons below.');
      </script>
0
Nikita