How to prevent files to upload if exceed specific size limit?

Question

In MVC, I need to make restriction to upload file limit size should not exceed 5 MB.

Here, i need to validate and restrict at client side only if exceed 5MB size limit.

I able to achieve using ajax file uploader but, it support IE 10 and above but, I delicately need to provide support for IE 9 and above.

Please guide how i can make the validation at client side or any alternative solution ?

score 3 · Answer 1 · answered Feb 19 '15 at 11:18

3

To check when a file is uploaded, you could add in a web.config key:

<add key="maxRequestLength" value="5242880"/> <!-- in Bytes -->

then when you post a file in your code where file is the HttpPostedFileBase:

if (file.ContentLength > 0 && file.ContentLength < Convert.ToDouble(WebConfigurationManager.AppSettings["maxRequestLength"]) {
    //do stuff
}
else {
    //return error to view
}

In addition, you can enforce a site-wide limit in Web.Config via the following:

<system.web>
    <httpRuntime maxRequestLength="5120" /> <!-- in Kb -->
    ...

The top variable just allows you to nicely manage your on screen error though.

answered Feb 19 '15 at 11:18

scgough

5,099
3
30
48

It just get hang and show server processing when upload above the 5 MB . works fine when 5 mb only. but above that, just get stuck. so, need to restrict at client side only before reaching at server. – dsi Feb 19 '15 at 11:23
Maybe your server has a 5MB limit imposed so would override any client side code limits. If you add the 2nd part of my post to the web.cfg you could up the limit to say 7 or 8MB then add in the client side check at 5MB – scgough Feb 19 '15 at 11:25
Yes, but, how to restrict at client side for size limit ? – dsi Feb 19 '15 at 11:43

Nayan · Answer 2 · 2015-02-19T11:39:18.187

1

    Check java script/ JQuery validation:
    $('#file_select')[0].files[0], file.size

    check test code here : [Click Here][1]

      [1]: http://jsfiddle.net/rq8nA/



    $("input:file").change(function () {
           if ($(this).val() !== "") {
            var file = $('#file_select')[0].files[0];
               if(file.size > 5000) {
                $('#err').html("Could not upload more than 5kb");           
               }
           }
    });
    <input type="file" name="file" id="file_select" />
    <span id="err"></span>

edited Feb 19 '15 at 11:39

answered Feb 19 '15 at 11:24

Nayan

116
8

Thanks. But, can it work for IE 9 and able to get file size ? – dsi Feb 19 '15 at 11:44
Jquery works good in IE9. Sadly I dont have IE9 at work. I do check tonight from home.. :) – Nayan Feb 20 '15 at 12:44

score 0 · Answer 3 · answered Sep 17 '16 at 07:45

Try this below code,

$(function () {

            $("[id*='Attachments_']").change(function () {

                if (undefined != this.files) {
                    var f = this.files[0]
                    var id = this.id;
                    var extArray = new Array("dll", "exe");
                    var ext = f.name.replace(/^.*?\.([a-zA-Z0-9]+)$/, "$1");
                    if (ext == extArray[0] || ext == extArray[1]) {                            
                        alert("System will not allow to upload the files with extenstion(.exe,.dll).Try to upload a different file.");
                        //reset file upload control                            
                        $("#" + this.id).replaceWith($("#" + this.id).clone(true));
                        return false;
                    } 
                    //here I CHECK if the FILE SIZE is bigger than 5 MB (numbers below are in bytes)
                    else if (f.size > 5242880 || f.fileSize > 5242880) {
                        //show an alert to the user
                        alert("Allowed file size exceeded. (Max. 5 MB)");

                        //reset file upload control                            
                        $("#" + this.id).replaceWith($("#" + this.id).clone(true));
                        return false;
                    }
                }
            })
        });

score 0 · Answer 4 · answered Nov 21 '17 at 20:30

You can check the ContentLength in the controller POST action

 [HttpPost]
    [ValidateAntiForgeryToken]
    public ActionResult Create(Publication publication)
    {

        if (ModelState.IsValid)
        {
            if (publication.ImageUpload.ContentLength > (9))
            {
                ModelState.AddModelError("ImageData", "File size must be less than xxx MB");
                return View();
            }
            else
            { }

How to prevent files to upload if exceed specific size limit?

4 Answers4

Linked