[SOLVED] input type='file' ---- Check the file size before upload

[Humpty]

G'day JS guys,

 

I am completely new to JS, (been using PHP for a while).

 

I am creating a PHP site where end users are required to upload images.

 

I need to ensure that the end user doesn't upload a file that too big.

 

I can't find a way to set this limitation in the HTML, and checking it using PHP is too late as the file is already uploaded.

 

Is there some JS that I can use to check the file size client-side?  (It's also important that whatever JS I use, if any, doesn't contain Js scripts that will be a lot of dectors be considered spyware...I do realise that the end user can disable JS and also that they can alter settings of thier spyware software but if I can't cater for everyone I can at least cater for normal end users).

 

Background:

This is for uploading images of houses to a realestate site, a lot of people that use this (including realestate staff members wouldn't or don't resize images prior to uploading.

 

Thanks in advance

[fenway]

You can't do this in JS at all.

[Humpty]

bugger hey?

 

Well thanks for that anyway. I guess the end users who aren't bright enough to resize an image prior to uploading will just have to wait while thier huge 2MB+ files are being uploaded (possibly ten of them if they choose to).

 

Appreciate the response all the same though, far better than not getting a response. - Humpty

[Humpty]

OK:

 

Now although fenway was correct in that there is no JS to check this there are other steps we can take.

(mods: please don't kill this thread or post due to the below, because future forum readers may be looking for the same thing and not be able to find a solution elsewhere, it is possible that fenway knew of this but didn't mention it because I didn't ask for an alternative)

 

The below is HTML and PHP specific.

There is a an attribute to the input tag where the type is file which is "maxlength=xx" (xx being a size in bytes).  This is reported as not support in most mainstream browsers. 

 

If you are using PHP as your server side you can a hidden input field which will limit the file size.

 

This can be handy if you don't want the end user uploading a 10 MB file for example. (because that would take a long time) you can specify a file size of say 1MB (1000000 bytes) and although it would take a while for that to upload it's ten times shorter because that file will be cut off at 1 MB and the remaining 9 MB will not be uploaded.  you can then use error checking to inform the user that thier file size was too big and that it should be less than 1MB  (or the size that you specify)

 

How to do it:

 

Add the following tag BEFORE the files input tag:

 <input type="hidden" name="MAX_FILE_SIZE" value="1000000"/>

 

I am unsure but presume that PHP would use the 1024 to 1 rule for file sizes (even though in the above example I used the 1000 to 1 rule).

 

-Humpty

[fenway]

You don't need that at all -- you can hard-code in whatever server-side limit you want (and you should abort the upload after that).

[Humpty]

Yes but doesn't that mean you have to edit the ini file? 

 

A lot of peole don't have access to these things, they just buy the hosting, use it as required and often don't bother with trying to get the host to change things

 

(I can only guess that a better host will be more accomodating for that sort of thing)

[fenway]

Not the PHP ini, the PHP script that's handling the upload.

[Humpty]

seriously?

 

I realise that this is a JS forum but we've alrady started so.... can i grab a push in the right direction?

 

Thanks - humpty