How to Upload a Folder instead of file using UploadBox

By default, the Uploadbox control allows to upload a single file or multiple files. Restrict or allow certain file type from being selected for upload. Similarly, the attributes of the upload box’s file type input element can be modified to upload a folder instead of file. Refer to the following code.

C#

@Html.EJ().Uploadbox("UploadDefault").SaveUrl("SaveDefault").RemoveUrl("RemoveDefault").ClientSideEvents(e => e.Create("oncreate")) 
 
<script> 
    function oncreate(){ 
       this.inputupload.attr("directory", ""); 
       this.inputupload.attr("webkitdirectory", ""); 
       this.inputupload.attr("mozdirectory", ""); 
    } 
</script> 

In the previous code, the Uploadbox’s create event can be used to add attributes to the file input element. The “directory” attribute in the file type input element will prevent from selecting an individual file and allows to select the folder. Once a folder is selected, all the contents in the folder are listed in the Uploadbox. 

Sample