html5/Javascript - How to get the Selected folder name?

Question

I am using webkitdirectory to select a folder. I want to get the folder name which is selected for uploading.

Liam · Accepted Answer · 2019-10-01 13:16:07Z

28

html:

<input type="file" id="FileUpload" onchange="selectFolder(event)" webkitdirectory mozdirectory msdirectory odirectory directory multiple />

javascript:

<script type="text/javascript">
function selectFolder(e) {
    var theFiles = e.target.files;
    var relativePath = theFiles[0].webkitRelativePath;
    var folder = relativePath.split("/");
    alert(folder[0]);
}
</script>

edited Oct 1, 2019 at 13:16

Liam

30k28 gold badges143 silver badges206 bronze badges

answered Jul 13, 2014 at 1:42

Noobish

1,2752 gold badges16 silver badges25 bronze badges

Sign up to request clarification or add additional context in comments.

5 Comments

MKR Over a year ago

I have noticed one limitation in above solution. If you have a blank folder then it doesn't work. Any idea how to fix it?

donutguy640 Over a year ago

@MKR what do you mean by blank folder? I'm not familiar with Mac or Linux, but I can't rename a folder to just spaces, or an empty string, which is what I take "blank" to mean.

MKR Over a year ago

@donutguy640 Suppose I have created a folder "ABC". That "ABC" folder does not contains any other files yet. In that scenario you cannot select the folder name.

Noobish Over a year ago

@MKR You are right. In new update of google chrome, it is not selecting a folder if it is empty.

user4717133 Over a year ago

what happen if directory is empty and need the path???

Collectives™ on Stack Overflow

html5/Javascript - How to get the Selected folder name?

1 Answer 1

5 Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

5 Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related