Gmail like file upload with jQuery

Question

I would like to upload files just like google mail does. I would want to use jQuery and PHP to do it is there anyway of getting the progressbar etc.?

Here I added a

Answer 1

In 2018, a website using plain JavaScript can upload files like Google Mail does for mail attachments. A single click can bring up the web browser's file explorer dialog. A separate Submit button is not needed to start the upload. The trick is to use a hidden HTML element.

Example HTML and JavaScript:

  
  
  


  
  Select some files

  

PHP code:

This works on Internet Explorer 11, Edge, Firefox, Chrome, Opera. This example was derived from https://developer.mozilla.org/en-US/docs/Web/API/File/Using_files_from_web_applications

For a progress bar, see How to get progress from XMLHttpRequest