Skip to content

Instantly share code, notes, and snippets.

@haroldoramirez
Forked from tanvir002700/(1) index.html
Created March 19, 2019 19:40
Show Gist options
  • Save haroldoramirez/c5ee23785ab0dcbb1d4cd0d4901e9374 to your computer and use it in GitHub Desktop.
Save haroldoramirez/c5ee23785ab0dcbb1d4cd0d4901e9374 to your computer and use it in GitHub Desktop.
Upload CSV file with Jquery.
<html>
<head>
<title>CSV upload</title>
</head>
<body>
<input type="file" name="filename" id="filename">
<button id="upload">upload</button>
<div class="csv"></div>
<script src="https://code.jquery.com/jquery-3.1.1.slim.min.js" integrity="sha256-/SIrNqv8h6QGKDuNoLGA4iret+kyesCkHGzVUUV0shc=" crossorigin="anonymous"></script>
<script src='app1.js'></script>
</body>
</html>
//this is the 1st way.
$(document).ready(function(){
$('#upload').click(function(){
var csv = $('#filename');
var csvFile = csv[0].files[0];
var ext = csv.val().split(".").pop().toLowerCase();
if($.inArray(ext, ["csv"]) === -1){
alert('upload csv');
return false;
}
if(csvFile != undefined){
reader = new FileReader();
reader.onload = function(e){
csvResult = e.target.result.split(/\r|\n|\r\n/);
$('.csv').append(csvResult);
}
reader.readAsText(csvFile);
}
});
});
//2nd way upload csv with jquery.
$("#filename").change(function(e){
var ext = $("#filename").val().split(".").pop().toLowerCase();
if($.inArray(ext, ["csv"]) == -1) {
alert('Upload CSV');
return false;
}
if(e.target.files != undefined){
var reader = new FileReader();
reader.onload = function(e){
csvResult = e.target.result.split(/\r|\n|\r\n/);
$('.csv').append(csvResult);
}
reader.readAsText(e.target.files.item(0));
}
});
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment