Validate File size before upload

Question

I need to validate the file which is to be uploaded to the server. The validation must be done before uploading it. i.e., validation completed at client side. This task should be accomplished in ASP.NET MVC3 Webpage. It should also work with all browsers. IE9,8,7/FF/Chrome. I came to know that IE doesn't have FileReader API.

My Question is, How to Validate file size before Uploading in a MVC3 Webpage.

Answer 1

You can achieve by using jquery:

#

<span>
<b>Attachment</b> (8 MB only)<label id="attached" style="color:red; margin-left:5px"></label>
</span>
<input type="file" id="Attachment" name="Attachment" class="admin_textfeildmedium" value="" style="width:551px" accept="image/*">

#

jQuery(document).ready(function () {


jQuery('#Attachment').bind('change', function () {
                            //fileUpload = 0;
                            var iSize = (this.files[0].size / 1024);
                            if (iSize / 1024 > 1) {
                                if (((iSize / 1024) / 1024) > 1) {
                                    fileUpload = 0;
                                } else {
                                    iSize = (Math.round((iSize / 1024) * 100) / 100);
                                    if (iSize <= 8) {
                                        fileUpload = 1;
                                    } else {
                                        fileUpload = 0;
                                    }
                                }
                            } else {
                                fileUpload = 1;
                            }
                            if (fileUpload == 0) {
                               // alert("Your attachment exceeded 8MB.");
                                jQuery('#attached').html('Your attachment exceeded 8MB.');
                                jQuery('#Attachment').val('');
                            }

                        });

                    });