Posted on Arjun

Uploading Directories At Once With webkitdirectory

We can use webkitdirectory to allow uploading an entire folder or folders of files without selecting each file manually.


webkitdirectory is a non-standard attribute that allows users to pick a directory via a file input. Currently supported in Chrome, Firefox and Edge.

Uploading Directories At Once

Here is example script, I have used bootstrap to style it.

Just to test, I have selected a directory called controllers, and I am getting list of all files in that directory and its sub-folders as shown below

Uploading Directories At Once With webkitdirectory

I hope you like this Post, Please feel free to comment below, your suggestion and problems if you face - we are here to solve your problems.

I am Arjun from Hyderabad (India). I have been working as a software engineer from last 7+ years, and its my passion to learn new things and implement them as a practice. Aside from work, I likes gardening and spending time with pets. Protection Status