TheRogerLAB Codes

Read a csv file using Javascript

  July, 2021

Introduction

A comma-separated values (CSV) file is a delimited text file that uses a comma to separate values. Each line of the file is a data record that consists of one or more fields, separated by commas. The use of the comma as a field separator is the source of the name for this file format. The term "CSV" also denotes some closely related delimiter-separated formats that use different field delimiters, for example, semicolons, tab-separated values and space-separated values

Step 1: Define a input type in HTML

Select a file:
<input type="file" id="myFile">
<button onclick='processFile()'>Process</button>

Step 2: Define a function to process the file in javascript

function processFile(){
  var file = document.querySelector('#myFile').files[0];
  var reader = new FileReader();
  reader.readAsText(file);

  //if you need to read a csv file with a 'ISO-8859-1' encoding
  /*reader.readAsText(file,'ISO-8859-1');*/

  //When the file finish load
  reader.onload = function(event) {

    //get the file.
    var csv = event.target.result;

    //split and get the rows in an array
    var rows = csv.split('\n');

    //move line by line
    for (var i = 1; i < rows.length; i++) {
      //split by separator (,) and get the columns
      cols = rows[i].split(',');

      //move column by column
      for (var j = 0; j < cols.length; j++) {
        /*the value of the current column.
        Do whatever you want with the value*/

        var value = cols[j];
      }
    }
  }
}
RATE THIS ARTICLE
4.6
18
TheRogerLAB Codes
Powered by TheRogerLAB Sandbox

info@therogerlab.com