Check file upload size of PHP or javascript based before uploading OR form submit

Question

I faced an issue that while working on Drupal/PHP forms there was a requirement to check upload file size before uploading, and it was required to be done by using javascript or PHP.

Issue is PHP is a server based language, and cannot interact efficiently with the browser in a sense that this is a client side thing.

And if we see javascript, browser show different results and are inconsistant.

I need a solution which can be run on every browser.

Thanks in advance. I am waiting for a solution.

Please note that I need solution for HTML not for HTML5

If this could help you - [HTML5 File API][https://developer.mozilla.org/en-US/docs/Using_files_from_web_applications] — Moazzam Khan, Aug 06 '13 at 11:11
Possible duplicate of - [Check file input size with jQuery]: http://stackoverflow.com/questions/1601455/check-file-input-size-with-jquery — Moazzam Khan, Aug 06 '13 at 11:14
@MoazzamKhan: second link is only for HTML 5, I need to for HTML only — Ata ul Mustafa, Aug 06 '13 at 11:27
first link - https://developer.mozilla.org/en-US/docs/Using_files_from_web_applications, its for HTML 5 — Moazzam Khan, Aug 06 '13 at 11:35
But i dont need html5 solution, I need it to be done for HTML 4 — Ata ul Mustafa, Aug 06 '13 at 11:40

score 0 · Answer 1 · answered Aug 06 '13 at 11:39

Check out the HTML5 File API, though older browsers won't be able to use it. Source Here.

    <input type="file" id="files" name="files[]" multiple />
<output id="list"></output>

<script>
  function handleFileSelect(evt) {
    var files = evt.target.files; // FileList object

    // files is a FileList of File objects. List some properties.
    var output = [];
    for (var i = 0, f; f = files[i]; i++) {
      output.push('<li><strong>', escape(f.name), '</strong> (', f.type || 'n/a', ') - ',
                  f.size, ' bytes, last modified: ',
                  f.lastModifiedDate ? f.lastModifiedDate.toLocaleDateString() : 'n/a',
                  '</li>');
    }
    document.getElementById('list').innerHTML = '<ul>' + output.join('') + '</ul>';
  }

  document.getElementById('files').addEventListener('change', handleFileSelect, false);
</script>

Check file upload size of PHP or javascript based before uploading OR form submit

1 Answers1