Start creating table
This commit is contained in:
parent
acc42e8b46
commit
4c0962359d
3 changed files with 26 additions and 5 deletions
|
@ -24,4 +24,8 @@
|
||||||
.topnav p.active {
|
.topnav p.active {
|
||||||
background-color: #4CAF50;
|
background-color: #4CAF50;
|
||||||
color: white;
|
color: white;
|
||||||
|
}
|
||||||
|
|
||||||
|
.table {
|
||||||
|
|
||||||
}
|
}
|
12
index.html
12
index.html
|
@ -21,7 +21,17 @@
|
||||||
</ul>
|
</ul>
|
||||||
</nav>
|
</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>
|
</body>
|
||||||
|
|
||||||
</html>
|
</html>
|
15
main.js
15
main.js
|
@ -1,11 +1,12 @@
|
||||||
// Source: https://blog.mounirmesselmeni.de/2012/11/20/reading-csv-file-with-javascript-and-html5-file-api/
|
// 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/
|
// 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.
|
// Check for the various File API support.
|
||||||
if (window.FileReader) {
|
if (window.FileReader) {
|
||||||
// FileReader are supported.
|
// FileReader are supported.
|
||||||
getAsText(files[0]);
|
|
||||||
|
getAsText(file);
|
||||||
} else {
|
} else {
|
||||||
alert('FileReader are not supported in this browser.');
|
alert('FileReader are not supported in this browser.');
|
||||||
}
|
}
|
||||||
|
@ -13,8 +14,13 @@ function handleFiles(files) {
|
||||||
|
|
||||||
function getAsText(fileToRead) {
|
function getAsText(fileToRead) {
|
||||||
var reader = new FileReader();
|
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);
|
reader.readAsText(fileToRead);
|
||||||
|
|
||||||
// Handle errors load
|
// Handle errors load
|
||||||
reader.onload = loadHandler;
|
reader.onload = loadHandler;
|
||||||
reader.onerror = errorHandler;
|
reader.onerror = errorHandler;
|
||||||
|
@ -44,7 +50,8 @@ function processData(csv) {
|
||||||
}
|
}
|
||||||
|
|
||||||
table += "</table>";
|
table += "</table>";
|
||||||
$("#parsed_csv_list").html(table);
|
|
||||||
|
document.getElementById('table_bla').innerHTML = table;
|
||||||
}
|
}
|
||||||
|
|
||||||
function errorHandler(evt) {
|
function errorHandler(evt) {
|
||||||
|
|
Loading…
Reference in a new issue