233rr 233rr - 2 months ago 18
HTML Question

How to create a popup window to select a file in a local directory?

I want to create a popup window that shows me all the files in a certain directory like ex a /functions directory. I want to be able to click a file in that directory, click ok, and store it's info in variables (not upload it), How would I do this?

I've tried using a form as:

<form action="" method="post" enctype="multipart/form-data">

But with that I can't specify a directory to open specificlly, I have to manually navigate to that directory.

I've tried using window.open()

window.open("file:///" + "home/user/Desktop/demo/functions");

I've tried using an onclick link mechanism:

<a onclick="file:///+ "home/user/Desktop/demo/functions"">Open folder</a>

None of these seem to work, any ways I could approach this problem?


In JavaScript, file handling gets a bit messy. The only way to grab the contents of a folder from JavaScript would be to connect to a server and have a serverside code in a different language relay the folder information back to JavaScript.

The only way I can think that we could be able to fake this result is by placing an index.html file inside of the target directory. This index.html file would then have the names of all the files in the folder within it. However, they would have to be manually plugged into the HTML file. (if you know how to use PHP, it can scan a directory and push the contents to the HTML file)

When a web browser has to navigate to a folder, it asks the server for an index file (usually this will be an HTML or PHP file). This index would then have the contents of the folder inside of it.

If the folder is indeed on the local computer, however, there is one final way we can do this...

If the page navigates to a folder using a window.location of something akin to file:///C://Users/USERNAME/Desktop/My%20Folder/, chrome (or whatever browser you are using) will navigate to the directory and display the contents of the directory. However, since you can't put JavaScript into this browser-generated index page, you won't be able to manipulate it.