JSON导出CSV中文乱码解决方案

前言

      以往datagrid导出数据全部在后台搞定,现在就想换中思路去解决,正常情况下使用easyui datagrid ajax获取数据源时都是json格式,那么此时需要导出数据时只要把该数据源扔出来直接导出CSV即可。

 

中文乱码

     导出CSV后,字母和数字正常,中文成了乱码,一番google发现,有人提出用BOM的方式解决,主要是在导出路径添加后缀 \uFEFF

 

导出方法

 

 1 function JSONToCSVConvertor(JSONData, ReportTitle, ShowLabel) {
 2             //If JSONData is not an object then JSON.parse will parse the JSON string in an Object
 3             var arrData = typeof JSONData != 'object' ? JSON.parse(JSONData) : JSONData;
 4 
 5             var CSV = '';
 6             //Set Report title in first row or line
 7 
 8             CSV += ReportTitle + '\r\n\n';
 9 
10             //This condition will generate the Label/Header
11             if (ShowLabel) {
12                 var row = "";
13 
14                 //This loop will extract the label from 1st index of on array
15                 for (var index in arrData[0]) {
16 
17                     //Now convert each value to string and comma-seprated
18                     row += index + ',';
19                 }
20 
21                 row = row.slice(0, -1);
22 
23                 //append Label row with line break
24                 CSV += row + '\r\n';
25             }
26 
27             //1st loop is to extract each row
28             for (var i = 0; i < arrData.length; i++) {
29                 var row = "";
30 
31                 //2nd loop will extract each column and convert it in string comma-seprated
32                 for (var index in arrData[i]) {
33                     row += '"' + arrData[i][index] + '",';
34                 }
35 
36                 row.slice(0, row.length - 1);
37 
38                 //add a line break after each row
39                 CSV += row + '\r\n';
40             }
41 
42             if (CSV == '') {
43                 alert("Invalid data");
44                 return;
45             }
46 
47             //Generate a file name
48             var fileName = "";
49             //this will remove the blank-spaces from the title and replace it with an underscore
50             fileName += ReportTitle.replace(/ /g, "_");
51 
52             //Initialize file format you want csv or xls
53             var uri = 'data:text/csv;charset=utf-8,\uFEFF' + encodeURI(CSV);
54 
55             // Now the little tricky part.
56             // you can use either>> window.open(uri);
57             // but this will not work in some browsers
58             // or you will not get the correct file extension    
59 
60             //this trick will generate a temp <a /> tag
61             var link = document.createElement("a");
62             link.href = uri;
63 
64             //set the visibility hidden so it will not effect on your web-layout
65             link.style = "visibility:hidden";
66             link.download = fileName + ".csv";
67 
68             //this part will append the anchor tag and remove it after automatic click
69             document.body.appendChild(link);
70             link.click();
71             document.body.removeChild(link);
72         }

 

转载于:https://www.cnblogs.com/sword-successful/p/4380861.html

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值