<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>JSP Page</title>
<style type="text/css">
#filecontents {
border:double;
overflow-y:scroll;
height:400px;
}
</style>
</head>
<body>
<script>
window.onload = function () {
//Check the support for the File API support
if (window.File && window.FileReader && window.FileList && window.Blob) {
var fileSelected = document.getElementById('txtfiletoread');
fileSelected.addEventListener('change', function (e) {
//Set the extension for the file
var fileExtension = /text.*/;
//Get the file object
var fileTobeRead = fileSelected.files[0];
//Check of the extension match
if (fileTobeRead.type.match(fileExtension)) {
//Initialize the FileReader object to read the 2file
var fileReader = new FileReader();
fileReader.onload = function (e) {
var fileContents = document.getElementById('filecontents');
fileContents.innerText = fileReader.result;
};
fileReader.readAsText(fileTobeRead);
}
else {
alert("Please select text file");
}
}, false);
}
else {
alert("Files are not supported");
}
};
</script>
Please Select text file of which contents are to be read:
<input type="file" id="txtfiletoread" />
<div>The File Contents are as below:</div>
<div id="filecontents">
</div>
</body>
</html>
No comments:
Post a Comment