Start creating table

This commit is contained in:
hodasemi 2018-10-21 18:03:11 +02:00
parent acc42e8b46
commit 4c0962359d
3 changed files with 26 additions and 5 deletions

View file

@ -24,4 +24,8 @@
.topnav p.active {
background-color: #4CAF50;
color: white;
}
.table {
}

View file

@ -21,7 +21,17 @@
</ul>
</nav>
<input type="file" id="csvFileInput" onchange="handleFiles(this.files)" accept=".csv">
<!--
<input type="file" id="csvFileInput" onchange="handleFiles(this.files)" accept=".csv" />
-->
<table id="table_bla"></table>
<script>
handleFile("world_data_v1.csv")
</script>
</body>
</html>

15
main.js
View file

@ -1,11 +1,12 @@
// Source: https://blog.mounirmesselmeni.de/2012/11/20/reading-csv-file-with-javascript-and-html5-file-api/
// Source: https://www.js-tutorials.com/javascript-tutorial/reading-csv-file-using-javascript-html5/
function handleFiles(files) {
function handleFile(path) {
// Check for the various File API support.
if (window.FileReader) {
// FileReader are supported.
getAsText(files[0]);
getAsText(file);
} else {
alert('FileReader are not supported in this browser.');
}
@ -13,8 +14,13 @@ function handleFiles(files) {
function getAsText(fileToRead) {
var reader = new FileReader();
// Read file into memory as UTF-8
// Read file into memory as UTF-8
// TODO: fileToRead is the path to the file -> create a file handle
reader.readAsText(fileToRead);
// Handle errors load
reader.onload = loadHandler;
reader.onerror = errorHandler;
@ -44,7 +50,8 @@ function processData(csv) {
}
table += "</table>";
$("#parsed_csv_list").html(table);
document.getElementById('table_bla').innerHTML = table;
}
function errorHandler(evt) {