image size validation in javascript example

0
()

image size validation in javascript example : Validation of file size while uploading using JavaScript / jQuery. explain to you how to check file (Image) size validation before upload the file using Javascript.

image size validation in javascript example

We will explain to you how to check file (Image) size validation before upload the file using Javascript. The File Size Validation plugin handles blocking of files that are too large

How To Validate Max File Size Using Javascript?

index.html

<html>
<head>
  <meta charset="utf-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <title>File upload size validation in javascript - www.pakainfo.com</title>
  <link href="https://stackpath.bootstrapcdn.com/bootstrap/3.4.1/css/bootstrap.min.css" rel="stylesheet">
  <script src="https://code.jquery.com/jquery-3.5.1.min.js"></script>  
</head>
<body>
  <h3 style="text-align: center;">File upload size validation in javascript - www.pakainfo.com</h3>
  <div class="col-md-6 col-md-offset-5"><br>
  <input type="file" name="file"  id="uploadnewfl"><br>
  <span id="messageDisplayErr" class="validation-error-label"></span>
  </div>
</body>
</html>

Don’t Miss : File upload required validation in javascript

Read Also:  Update database using ajax php - How to edit or update Data using PHP Ajax?

script.js

<script type="text/javascript">
  $(document).ready(function(){
    $('#uploadnewfl').on('change',function(){
      for(var i=0; i< $(this).get(0).files.length; ++i){
        var file1 = $(this).get(0).files[i].size;
        if(file1){
          var file_size = $(this).get(0).files[i].size;
          if(file_size > 2000000){
            $('#messageDisplayErr').html("File upload size is larger than 2MB");
            $('#messageDisplayErr').css("display","block");
            $('#messageDisplayErr').css("color","red");
          }else{
            $('#messageDisplayErr').css("display","none");
          }
        }
      }
    });
  });
</script>

Don’t Miss : Check multiple file extension in jQuery

Download

I hope you get an idea about image size validation in javascript example.
I would like to have feedback on my infinityknow.com blog.
Your valuable feedback, question, or comments about this article are always welcome.
If you enjoyed and liked this post, don’t forget to share.

Read Also:  date time picker jquery

How useful was this post?

Click on a star to rate it!

Free Live Chat for Any Issue