How to check file size when select multiple file validation by using Jquery?

Share Me
  •  
  •  
  •  
  •  
  •  
  •  
  •  
  •  
  •  
  •  
  •  

Today now in this post i will show you How we can check file size when we are select multiple file for validation by using Jquery. Sometimes we need to add validation for max file size by using jquery. If you have only one single file for validation then it is very easily to do that. But if you have multiple file then we need to calculate the size of all selected files and then need to check max required file size.

Now in this example we can see that how to check the validation for max size for multiple file select by using jquery.

Example:
<html lang="en">
<head>
    <title>Jquery - multiple image upload with size validation</title>
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.js"></script> 
</head>
<body>


<div class="container text-center">

	
    <div class="grid-stack">
        <input type="file" id="fUpload" multiple />
        <button>Save</button>
    </div>


    <script type="text/javascript">
    $(document).ready(function(){
        $('#fUpload').change(function(){
               var fp = $("#fUpload");
               var lg = fp[0].files.length; // get length
               var items = fp[0].files;
               var fileSize = 0;
           
           if (lg > 0) {
               for (var i = 0; i < lg; i++) {
                   fileSize = fileSize+items[i].size; // get file size
               }
               if(fileSize > 2097152) {
                    alert('File size must not be more than 2 MB');
                    $('#fUpload').val('');
               }
           }
        });
    });
    </script>

            
</div>	


</body>
</html>

Read Also: How we can create virtual host in ubuntu apache?

Thanks for read. I hope it help you. For more you can follow us on facebook

About Shahriar Sagor

My name is Shahriar sagor. I'm a developer. I live in Bangladesh and I love to write tutorials and tips that will help to other Developer's. I am a big fan of PHP, Javascript, JQuery, Laravel, Codeigniter, VueJS, AngularJS and Bootstrap from the early stage.

View all posts by Shahriar Sagor →