metavoid
4/24/2014 - 5:42 PM

Trigger a file open dialog and read local file in JavaScript

Trigger a file open dialog and read local file in JavaScript

/*
* Trigger a file open dialog and read local file, then read and log the file contents
*/

var element = document.createElement('div');
element.innerHTML = '<input type="file">';
var fileInput = element.firstChild;

fileInput.addEventListener('change', function() {
    var file = fileInput.files[0];

    if (file.name.match(/\.(txt|json)$/)) {
        var reader = new FileReader();

        reader.onload = function() {
            console.log(reader.result);
        };

        reader.readAsText(file);    
    } else {
        alert("File not supported, .txt or .json files only");
    }
});

fileInput.click();