Is it possible to use Javascript to check for a file's size (at the client side) before it is actually uploaded to the server?
The application is built on EXTJS and Java and is restricted to usage by Internet Explorere 7 on Windows XP machines. No usage of activeX is allowed.
The workflow is as such: User selects a file to upload. Validation kicks in immediately to check for file type and filesize. If filesize exceeds limit, the GUI will prompt with error. If filesize is within the limit, the full filepath will be passed to the server end (java servlet) to be uploaded.
Is the filesize check and reading of full file path possible to be achieved with javascript?
Is it possible to use Javascript to check for a file's size (at the client side) before it is actually uploaded to the server?
The application is built on EXTJS and Java and is restricted to usage by Internet Explorere 7 on Windows XP machines. No usage of activeX is allowed.
The workflow is as such: User selects a file to upload. Validation kicks in immediately to check for file type and filesize. If filesize exceeds limit, the GUI will prompt with error. If filesize is within the limit, the full filepath will be passed to the server end (java servlet) to be uploaded.
Is the filesize check and reading of full file path possible to be achieved with javascript?
Share Improve this question asked Sep 2, 2011 at 3:53 user924590user924590 1211 gold badge1 silver badge4 bronze badges 04 Answers
Reset to default 4It is possible with ActiveX Objects.
<html>
<head>
<script>
function getSize()
{
var myFSO = new ActiveXObject("Scripting.FileSystemObject");
var filepath = document.upload.file.value;
var thefile = myFSO.getFile(filepath);
var size = thefile.size;
alert(size + " bytes");
}
</script>
</head>
<body>
<form name="upload">
<input type="file" name="file">
<input type="button" value="Size?" onClick="getSize();">
</form>
</body>
</html>
There's currently no way to portably check the size of an uploaded file from the web browser. The HTML5 File API makes this possible, but that's not available in MSIE7 -- it's currently on track for MSIE10.
There is intentionally no way to determine the full path of an uploaded file, as that may include sensitive information, like the name of the end user.
The reason you can't is because it would be bad if browsers, and javascript, could access the clients filesystem.
This is actively denied and can be seen as an attack.
Using jQuery, Restricting File Size Before Uploading
Please try below code,
<html>
<head>
<script type="text/javascript" src="http://code.jquery.com/jquery-1.7.1.js"></script>
<script type="text/javascript">
$(function() {
$("document").ready(function(){
$("#myFile1").change(function() {
var f1=document.getElementById("myFile1").value;
if((f.size||f.fileSize)==09765625)
{
alert("file size is less than 1mb");
}
else
{
alert("file size should not exceed more than 1mb");
$(this).val($.data(this, 'f'));
return false;
}
});
});
})
</script>
</head>
<body>
<input type='file' name="file" id="myFile1" />
</body>
</html>