Let's take a look at my JavaScript code snippet:
function initiate(){
let jsonData = parseCSVFile();
console.log(jsonData);
let csvData = transformCSVData(jsonData);
console.log(csvData);
}
function parseCSVFile(){
let parsedJson;
let chosenFile = document.getElementById('fileInput').files[0];
Papa.parse(chosenFile, {
complete: function(results) {
parsedJson = results.data;
console.log(results.data);
console.log(typeof(results.data));
}
});
return parsedJson;
}
function transformCSVData(inputJSON){
let newCSV = ""; // will be modified later
let dataColumn = ""; // will be modified later
let dataRow = ""; // will be modified later
for (let i = 0; i < inputJSON.length - 1; i++) {
// modifications to be made here in the future
}
return newCSV;
}
Next, I have included this script in my test HTML page:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Document</title>
</head>
<body>
<script src=".\transformCSV.js"></script>
<script src=".\node_modules\papaparse\papaparse.js"></script>
<input type="file" id="fileInput">
<input type="button" value="Click Here!" onclick="initiate()">
</body>
</html>
When attempting to access the length of jsonData
, an error message appears in the Chrome console:
Uncaught TypeError: Cannot read property 'length' of undefined
. Why is it showing undefined? It clearly exists in the console! What could be causing this issue and how can I resolve it? Is there a way to handle jsonData
as a static JSON object?