Error with jQuery get of a CSV file

Question

Here is my relevant jQuery code:

$.get('sampleData.csv', function(data) {
    var lines = data.split('\r\n');

The first few line of the sampleData.csv file look like this:

2009,0,2,29.0000
2009,0,6,655.6200

I get 2 errors. On the first line of csv file I get the error

syntax error

On the 2nd line of code I get the error

data.split is not a function

What am I doing wrong?

ETA According to the firebug console, the responseText is the following:

2009,0,2,29.0000\r\n2009,...\r\n2011,10,30,494.3500\r\n

ETA I added an alert of the data before I try splitting it into lines, and I get the following:

[Object XMLDocument]

What is the specific syntax error you're getting.

Rory McCrossan
– Rory McCrossan

2011-11-18 16:53:43 +00:00
Commented Nov 18, 2011 at 16:53 — Rory McCrossan
– Rory McCrossan, Commented Nov 18, 2011 at 16:53

g19fanatic · Accepted Answer · 2011-11-18 18:09:49Z

1

I believe you misunderstand what jQuery.get() is suppose to be used for.

From it's doc page, "...Load data from the server using a HTTP GET request...."

Doing a $.get() on a file will not get you that file's data into a structure that can be used. You have to request this through a server which will then provide the .csv data ... it should look something like the following

$.get('http://url.to.server.page',function(data){
    var dataStr = new String(data);
    var lines = dataStr.split('\n');
});

EDIT:: Since you say the data is being 'loaded' properly, try this fiddle. It works just fine.

EDIT2::

Your last edit gave some interesting insight. When it pulls the .csv file, its converting it to a type of XML vs text. Try the following:

$.get('http://url.to.server.page',function(data){
    var dataStr = new String(data);
    var lines = dataStr.split('\n');
},dataType='text');

This should put the returning 'data' into the proper string format.

edited Nov 18, 2011 at 18:09

answered Nov 18, 2011 at 17:12

g19fanatic

11.1k6 gold badges37 silver badges66 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

dmr Over a year ago

According to the firebug console, it appears to be retrieving the data correctly.

dmr Over a year ago

It seems like your first answer (misunderstanding jQuery get) is the correct one. Thanks!

Andrey · Accepted Answer · 2012-05-25 16:54:09Z

1

jQuery code:

$.get('data.csv', function(data) {
  var lines = data.split('\r\n');
});

works until jquery version 1.5.
From version 1.5 callback function in get() method is passed "jqXHR" object, not "XMLHttpRequest" object.
Code can be changed to:

$.get('data.csv', function(data) {
  var lines = data.split('\r\n');
}, "text");

Then it will work.

http://api.jquery.com/jQuery.get/

answered May 25, 2012 at 16:54

Andrey

1,64318 silver badges14 bronze badges

Comments

Chris · Accepted Answer · 2011-11-18 17:14:07Z

Your almost there. Missing the final parenthesis and need a different split character.

$.get('sampleData.csv', function(data) {
var lines = data.split(',');
});

Edit

Ah you changed your CSV to two lines i assumed it was just one line seperated by commas not data seperated by new line also seperated by commas. The below I retested and worked fine for me.

<html>
<head>
<script type="text/javascript">Jquery Reference or insert directly here </script>
</head>
<body>
<script>
$(document).ready(function(){

    $.get('csv.csv', function(data) {
    // Split the lines
    var lines = data.split('\n');
    var i = 0;

    for(i=0; i<lines.length; i++)
    {
       alert(lines[i]);
    }

}); 

});
</script>
</body>

</html>

I just had that html file on my desktop with the csv you pasted in the same place.

Collectives™ on Stack Overflow

Error with jQuery get of a CSV file

3 Answers 3

2 Comments

Comments

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

2 Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related