Parsing And Displaying CSV Files In jQuery - csv.js

csv.js is a jQuery based CSV parser that parses your CSV files and converts the CSV strings into JavaScript arrays and objects for further use. Ideal for dynamically generating data tables and data charts/graphs from CSV files. Supports both browser and node.js.

1. Insert the main JavaScript file csv.js after jQuery JavaScript library.

<script src="https://code.jquery.com/jquery-1.12.4.min.js" 
        integrity="sha384-nvAa0+6Qg9clwYCGGPpDQLVpLNn0fRaROjHqs13t4Ggj3Ez50XnGQqc/r8MhnRDZ" 
        crossorigin="anonymous">
</script>
<script src="src/jquery.csv.js"></script>

2. The JavaScript to parse a single line of CSV data into an array of values.

$.csv.toArray(csv)

3. The JavaScript to parse CSV data into a JavaScript 2D (two-dimensional) array.

$.csv.toArrays(csv)

4. The JavaScript to parse CSV data into an array of objects.

$.csv.toObjects(csv)

5. Possible plugin options.

$.csv.functionName(csv, {
  // separator
  separator:',',
  // delimiter
  delimiter:'"',
  // shows headers
  headers:true
});

6. Event handlers.

$.csv.functionName(csv, {
  onPreParse: function(){},
  onParseEntry: function(){},
  onParseValue: function(){},
  onPostParse: function(){},
});

7. Use the plugin in node.js.

var fs = require('fs');
var $ = jQuery = require('jQuery');
require('src/jquery.csv.js');
var sample = 'sample.csv';
fs.readFile(sample, 'UTF-8', function(err, csv) {
  $.csv.toArrays(csv, {}, function(err, data) {
    for(var i=0, len=data.length; i<len; i++) {
      console.log(data[i]);
    }
  });
});

This awesome jQuery plugin is developed by JeremyMorgan. For more Advanced Usages, please check the demo page or visit the official website.