I want to add Folder Selection option in my open file dialog

Question

I am using the below method to open the open file dialog. I want to modify this to allow me to select folder as well for input.

open()
{
this.$el.querySelector('input[type=file]').click();
}

Answer 1

You are looking for the files property, which returns a filelist. Use length to get the number of files then use a for statement to do the same for all files, increasing the count by 1 each time

var folder = document.getElementById("myInput");
    folder.onchange=function(){
       var files = folder.files,
       len = files.length,
       i;
      for(i=0;i<len;i+=1){
        console.log(files[i]);
      }
 }

The HTMLInputElement.webkitdirectory is a property that reflects the webkitdirectory HTML attribute and indicates that the element should let the user select directories instead of files. When a directory is selected, the directory and its entire hierarchy of contents are included in the set of selected items. The selected file system entries can be obtained using the webkitEntries property

<input id="myInput" type="file" webkitdirectory directory multiple/>


https://developer.mozilla.org/en-US/docs/Web/API/HTMLInputElement/webkitdirectory