How to find the contents of a directory with JavaScript?

Hello!

I am trying to augment our presentation app for our company. The first step I need to do is to read out the (nested) contents of directories. Is this possible without having access to a server? In other words, for this step, the user enters an directory path, and my small function returns a string array of all the filen names that are inside this directory. The directory structure may or may not be flat.

Thank you for your information! If there is no solution in pure JavaScript, a solution with Angular.JS or some additional API of it is also a useful answer for me.

Thank you in advance!
LVL 1
Ahmet Ekrem SABANSenior IT consultantAsked:
Who is Participating?

[Product update] Infrastructure Analysis Tool is now available with Business Accounts.Learn More

x
I wear a lot of hats...

"The solutions and answers provided on Experts Exchange have been extremely helpful to me over the last few years. I wear a lot of hats - Developer, Database Administrator, Help Desk, etc., so I know a lot of things but not a lot about one thing. Experts Exchange gives me answers from people who do know a lot about one thing, in a easy to use platform." -Todd S.

Ahmet Ekrem SABANSenior IT consultantAuthor Commented:
Thank you for your reply! It works somehow, but there are some problems. First, when the user selects directories inside the directory, they are disregarded. When the user selects one directory only, it is opened to make further selections inside this directory possible. Second, the user has to select files, which is not allowed in my case – it should be possible to get the same result w/o selecting the files in the dialogue. And thirdly, all the contents of possible subdirectories should be returned somehow by this code.
krishna kishore mellacheruvu venkataCommented:
try this?

<script type="text/javascript">

    var fso = new ActiveXObject("Scripting.FileSystemObject");

    function ShowFolderFileList(folderspec){

        var s = "";
        var f = fso.GetFolder(folderspec);

    // recurse subfolders
    var subfolders = new Enumerator(f.SubFolders);
    for(; !subfolders.atEnd(); subfolders.moveNext()){s+=ShowFolderFileList((subfolders.item()).path);}  

    // display all file path names.
    var fc = new Enumerator(f.files);
        for (; !fc.atEnd(); fc.moveNext()){s += fc.item() + "<br>";}

        return s;
    }

</script>

<script type="text/javascript">
    function listFiles(){
    document.getElementById('files').innerHTML = ShowFolderFileList('C:');
    }
</script>
Ahmet Ekrem SABANSenior IT consultantAuthor Commented:
Thank you for your help! I selected two directories & six images at once in the following way: With

FireFox 40.3: To the right of the button, the text "6 files selected." appeared (no errors in the console).
Google Chrome 46.0: In the console, I got the error message "index.html:20 Uncaught ReferenceError: ActiveXObject is not defined" (line var fso = new ActiveXObject("Scripting.FileSystemObject");)
Microsoft Edge 20:Selected to allow the blocked content and allowed the Active-X control element. Nothing happened (no errors in the console).
Microsoft Internet Explorer 11.0: Selected to allow the blocked content and allowed the Active-X control element. Nothing happened (no errors in the console).
Determine the Perfect Price for Your IT Services

Do you wonder if your IT business is truly profitable or if you should raise your prices? Learn how to calculate your overhead burden with our free interactive tool and use it to determine the right price for your IT services. Download your free eBook now!

krishna kishore mellacheruvu venkataCommented:
May be you need to check the browser compatibility also.
So it is working in Firefox but not in IE 11?
Ahmet Ekrem SABANSenior IT consultantAuthor Commented:
Yes, but that is Node.JS (not Angular.JS or pure JavaScript), and would require a serverside. My question is whether or not it is possible to solve the problem from the client side only. :-)
krishna kishore mellacheruvu venkataCommented:
We may need to use Angular.js i believe.
Ahmet Ekrem SABANSenior IT consultantAuthor Commented:
How?
Julian HansenCommented:
You cannot do this without input from the user - there is no solution in JavaScript that allows a script to read files on a computer without interaction from the user. This is an obvious security requirement - you can't have JavaScript in the wild reading your file system.

To use the FileReader libraries the user needs to provide the script with a file or list of files as the result of an <input> or drag and drop operation.

It is possible to do this with an ActiveX object - but this approach is not supported across all browsers.

If you want to support all browsers then there is simply no way of doing this without user input.

Experts Exchange Solution brought to you by

Your issues matter to us.

Facing a tech roadblock? Get the help and guidance you need from experienced professionals who care. Ask your question anytime, anywhere, with no hassle.

Start your 7-day free trial
krishna kishore mellacheruvu venkataCommented:
Thank you. Will take care.
It's more than this solution.Get answers and train to solve all your tech problems - anytime, anywhere.Try it for free Edge Out The Competitionfor your dream job with proven skills and certifications.Get started today Stand Outas the employee with proven skills.Start learning today for free Move Your Career Forwardwith certification training in the latest technologies.Start your trial today
JavaScript

From novice to tech pro — start learning today.