akaban01/CSV-PapaParse.html

## CSV-PapaParse.html
<!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>file reader</title>
</head>

<body>

    <h1>Let me read your file data</h1>
    <input id="files" type="file">
    <textarea id="dataToShow"></textarea>
    <div id="list"></div>

    <script>
        // Check for the various File API support.
        if (window.File && window.FileReader && window.FileList && window.Blob) {
            console.log('Great success! All the File APIs are supported. i.e. window.File && window.FileReader && window.FileList && window.Blob');
        } else {
            console.log('The File APIs are not fully supported in this browser.');
        }

        // this function will be triggered when user selects a file
        function handleFileSelect(evt) {
            console.log(evt);
            let file = evt.target.files[0]; // FileList object
            let config = {
                delimiter: "|",
                header: true,
                skipEmptyLines: true,
                complete: function (results, file) {
                    console.log("Parsing complete:", results, file);
                    document.getElementById("dataToShow").value = results
                }
            };
            Papa.parse(file, config);
        }

        //triggers
        document.getElementById('files').addEventListener('change', handleFileSelect, false);
    </script>
</body>

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

</html>
	<!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>file reader</title>
	</head>

	<body>

	<h1>Let me read your file data</h1>
	<input id="files" type="file">
	<textarea id="dataToShow"></textarea>
	<div id="list"></div>

	<script>
	// Check for the various File API support.
	if (window.File && window.FileReader && window.FileList && window.Blob) {
	console.log('Great success! All the File APIs are supported. i.e. window.File && window.FileReader && window.FileList && window.Blob');
	} else {
	console.log('The File APIs are not fully supported in this browser.');
	}

	// this function will be triggered when user selects a file
	function handleFileSelect(evt) {
	console.log(evt);
	let file = evt.target.files[0]; // FileList object
	let config = {
	delimiter: "\|",
	header: true,
	skipEmptyLines: true,
	complete: function (results, file) {
	console.log("Parsing complete:", results, file);
	document.getElementById("dataToShow").value = results
	}
	};
	Papa.parse(file, config);
	}

	//triggers
	document.getElementById('files').addEventListener('change', handleFileSelect, false);
	</script>
	</body>

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

	</html>