title: How to validate the image size before uploading?
body: <p>I want to validate the image size and extension before uploading an image .I have code for image extention and I want to restrict the size of the image.
  Here is the code for image extension:</p>
  
  <pre><code>function ValidateFileUpload() {
      var fuData = document.getElementById('fileChooser');
      var FileUploadPath = fuData.value;
  
  
      if (FileUploadPath == '') {
          alert("Please upload an image");
  
      } else {
          var Extension = FileUploadPath.substring(
                  FileUploadPath.lastIndexOf('.') + 1).toLowerCase();
  
  
  
   if (Extension == "gif" || Extension == "png" || Extension == "bmp"
                  || Extension == "jpeg" || Extension == "jpg") {
  
  
              if (fuData.files &amp;&amp; fuData.files[0]) {
                  var reader = new FileReader();
  
                  reader.onload = function(e) {
                      $('#blah').attr('src', e.target.result);
                  }
  
                  reader.readAsDataURL(fuData.files[0]);
              }
  
          } 
  
  
    else {
              alert("Photo only allows file types of GIF, PNG, JPG, JPEG and BMP. ");
  
          }
      }
  }
  </code></pre>
  
  <p>HTML code</p>
  
  <pre><code>&lt;input type="file" name="image"  id="fileChooser" style="height:28px; width:175px;" onchange="return ValidateFileUpload()"&gt;
  </code></pre>