Using JavaScript to implement JSON data download _javascript tips in CSV format

Source: Internet
Author: User

Summary:
Recently, there is a small demand for projects, that is, the project development of the Division of documentation, facilitate the maintenance of later management. However, during development, the division of Labor was recorded in JSON format, so we did a download of JSON data in CSV format to local.

Code:

Copy Code code as follows:

<! DOCTYPE html>
<title>download csv</title>
<script src= "Http://code.jquery.com/jquery-1.11.0.min.js "></script>
<script type= "Text/javascript" src= "Download.js" ></script>
<body>
<div align= "center" >
<div class= ' mydiv ' >
<textarea id= "txt" class= ' txtarea ' rows= "cols=" >[{"Vehicle": "BMW", "Date": "June 2013 09:24 AM", " Location ":" Hauz Khas "," Speed ": 42},{" Vehicle ":" Honda CBR "," Date ":" June June 2013 12:00 AM "," Location ":" Military Road "," Speed ": 0},{" Vehicle ":" Supra "," Date ":" June 2013 07:53 AM "," Location ":" Sec-45 "," Speed ": 58},{" Vehicle ":" Land Cruiser "," Date ":" June 2013 09:35 AM "," Location ":" DLF Phase I "," Speed ":83}]</textarea>
</div>
<br/>
<button class= "Download" >download csv</button>
</div>
</body>

Download.js

Copy Code code as follows:

$ (document). Ready (function () {
"Use strict";
var mo = {
Init:function () {
$ ('. Download '). Click (function () {
var data = $ (' #txt '). Val ();
if (data = = "") {
Return
}
Mo. Jsontocsvconvertor (data, true);
});
},
Jsontocsvconvertor:function (Jsondata, ShowLabel) {
var arrdata = typeof jsondata!== ' object '? Json.parse (jsondata): Jsondata;
var CSV = ';
if (ShowLabel) {
var row = "";
For (var index in arrdata[0]) {
Row + = index + ', ';
}
row = Row.slice (0,-1);
CSV + = row + ' \ r \ n ';
}
for (var i = 0; i < arrdata.length; i++) {
var row = "";
For (var index in arrdata[i]) {
var arrvalue = Arrdata[i][index] = = null? "": ' = ' + Arrdata[i][index] + ' ";
Row + + Arrvalue + ', ';
}
Row.slice (0, row.length-1);
CSV + = row + ' \ r \ n ';
}
if (CSV = = ") {
Growl.error ("Invalid data");
Return
}
var fileName = "Result";
if (Mo.msieversion ()) {
var Iewindow = window.open ();
IEwindow.document.write (' sep=,\r\n ' + CSV);
IEwindow.document.close ();
IEwindow.document.execCommand (' SaveAs ', true, FileName + ". csv");
Iewindow.close ();
} else {
var uri = ' Data:application/csv;charset=utf-8, ' + Escape (CSV);
var link = document.createelement ("a");
Link.href = URI;
Link.style = "Visibility:hidden";
Link.download = FileName + ". csv";
Document.body.appendChild (link);
Link.click ();
Document.body.removeChild (link);
}
},
Msieversion:function () {
var ua = window.navigator.userAgent;
var msie = Ua.indexof ("MSIE");
if (Msie > 0 | |!! Navigator.userAgent.match (/trident.*rv\:11\./))//If Internet Explorer, return version number
{
return true;
else {//If another browser,
return false;
}
return false;
},
Main:function () {
Mo.init ();
}
};
Mo.main ();
});

Summary:
Note the JSON format [{},{}], filename is the variable filename defined in JS. The main problem is that he will automatically add a line of blank lines, and each element will precede the value with a ' = '.

The downloaded data format is:

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.