Reading *.csv file using JavaScript

Question

I have a csv file which has the following data format:

2001:200::,2001:200:ffff:ffff:ffff:ffff:ffff:ffff,
42540528726795050063891204319802818560,42540528806023212578155541913346768895,JP,,,36.0000,138.0000,,0,0
2001:208::,2001:208:ffff:ffff:ffff:ffff:ffff:ffff,
42540529360620350178005905068154421248,42540529439848512692270242661698371583,SG,,,1.3667,103.8000,,0,0

I want to only parse the item after the 1st comma (IPv6 address), and the lat/long (36.0000,138.0000 in the first record) values for this record.

How can I use JavaScript/ jQuery to do this?

• user6101582: encrypted.google.com/…

Answer 1

Use the split method to turn the string into an array and then iterate thru it as you wish.

var csv = "2001:200::,2001:200:ffff:ffff:ffff:ffff:ffff:ffff,4254052872679505006389120431980\n2818560,42540528806023212578155541913346768895,JP,,,36.0000,138.0000,,0,0"; 
var myArray = csv.split("\n");//You should know what kind of new line your csv is using
myArray.map(function (e) { //Applies this function over each element of myArray that is each line of your csv
 var line = e.split(","); //Turn the comma separated string into an array
 return "The second element is: " + line[1]; //Do what you need
});

Answer 2

Well the same way you would in any language. First you open the file. Read it line by line. Split each line on the comma. Use the index of the array to get the value you want.

jQuery.get('file.csv', function(data) {
 alert(data); // this is a line
 var tempArray = data.split(','); // array of data
 for(var i = 0; i < tempArray.length; i++)
 {
 console.log(tempArray[i]); // probably index 1 is your IPv6 address.
 }
});

• epascarello: there is no .Split() and .Length. I fixed your typos
• Radmation: Lol. Thanks. I updated it. I should really type this into an IDE before i post these xD. I am used to C#...
• robinhood91: @RadleyAnaya Wouldn't I need to convert this data into string before I split it? Also, how would JS split on 3 commas - ',,,'? Would it consider it a single comma?
• Vector: @newenthusiast Just try it. Open up your browser console and type ",,,".split(",") and see what you'll get. (It will return an array with 4 empty strings)
• Radmation: @newenthusiast - Yup vector is right. The .split() method returns an array. Take this for example: "The, dog,,ran.".split(','); You would get ["The", "dog", "", "ran."]

Answer 3

Or just use CSV libraries, I'd suggest PapaParse(Browser) or BabyParse(NodeJS)

Answer 4

Here's what you do :

$.ajax({
 type: "GET",
 url: "data.csv",
 success: function (data) {
 var data = Papa.parse(data);
 var output = {
 "IPv6" : data.data[0][1],
 "coordinates" : [data.data[1][5], data.data[1][6]]
 } /* -> These are the values you're looking for! */
 }
});

Because I can't demo the AJAX (due to cross-domain scripting issues), I'll demo just the success function below!

---

Demo

var data = '2001:200::,2001:200:ffff:ffff:ffff:ffff:ffff:ffff,'+ "\n" +
'42540528726795050063891204319802818560,42540528806023212578155541913346768895,JP,,,36.0000,138.0000,,0,0'+ "\n\n" +
'2001:208::,2001:208:ffff:ffff:ffff:ffff:ffff:ffff,'+ "\n" +
'42540529360620350178005905068154421248,42540529439848512692270242661698371583,SG,,,1.3667,103.8000,,0,0';
var success = function (data) {
 var data = Papa.parse(data);
 return output = {
 "IPv6" : data.data[0][1],
 "coordinates" : [data.data[1][5], data.data[1][6]]
 }
}
document.body.innerHTML = '<pre>' + JSON.stringify(success(data), null, 2) + '</pre>';

<script src="https://cdnjs.cloudflare.com/ajax/libs/PapaParse/4.1.2/papaparse.js"></script>

• robinhood91: how did you convert the csv data to a concatenation of strings (var data = " ")
• John Slegers: @newenthusiast : That string should automatically be passed to the success function if you run your $.ajax() method!