Reading a CSV file using JQuery
Reading a CSV file using JQuery
HTML
<input id="upload" type="file">
<form id="csvForm">
<input id="a"></input>
<input id="b" ></input>
<input id="c" ></input>
<input id="d"></input>
</form>
<button id="download">Download</button>
<input id="a3" onblur="calculate()"></input>
JavaScript
document.getElementById("upload").addEventListener("change", upload, false);
document.getElementById("download").addEventListener("click", download, false);
function upload(e) {
var data = null;
var file = e.target.files[0];
var reader = new FileReader();
reader.readAsText(file);
reader.onload = function (event) {
var csvData = event.target.result;
var parsedCSV = d3.csv.parseRows(csvData);
parsedCSV.forEach(function (d, i) {
if (i == 0) return true; // skip the header
document.getElementById(d[0]).value = d[1];
});
}
}
function download(e) {
data = [["id","value"]];
var f = d3.selectAll("#csvForm > input")[0];
f.forEach(function(d,i){
data.push([d.id, d.value]);
});
console.log(data);
var csvContent = "data:text/csv;charset=utf-8,";
data.forEach(function (d, i) {
dataString = d.join(",");
csvContent += i < data.length ? dataString + "\n" : dataString;
});
var encodedUri = encodeURI(csvContent);
var link = document.createElement("a");
link.setAttribute("href", encodedUri);
link.setAttribute("download", "FormData.csv");
link.click();
}
calculate = function()
{
var resources = document.getElementById('a').value;
var minutes = document.getElementById('b').value;
document.getElementById('a3').value = parseInt(resources)*parseInt(minutes);
}