How to open specific folder in <input type='file'>

Question

I want to upload images in my project from specific folder. when i click on choose file button it goes to default folder or last opened folder but i want to do it always open some specific folder like documents/all images/animals images/.

 <table>  
            <tr>  
                <td>First Name:</td>    
                <td><input type="text" name="firstName" size="10"  
                    required="required" /></td>  
            </tr>  
            <tr>  
                <td>Last Name:</td>  
                <td><input type="text" name="lastName" size="10"  
                    required="required" /></td>  
            </tr>  
            <tr>  
                <td>Choose Image:</td>  
                <td><input type="file" name="photo" size="10"  
                    required="required" /></td>  
            </tr>  
            <tr>  
                <td><input type="submit" value="Submit"></td>  
                <td><input type="reset" value="Clear" /></td>  
            </tr>  
        </table> 

someone tell me solution for this.

Answer 1

Actually that's impossible because of security reason with a pure HTML / Javascript. I don't if it's possible if you use ActiveX or Java Applet but those technologies are outdated.

Answer 2

Now you can do that, but only if you're using "Chrome" which supports these last two attributes:

<input type="file" id="folder-opener" webkitdirectory multiple/>

This worked well for me, though keep in mind that now this input tag won't let you select single files. Just directories.

If that's ok for you, then you'll be able to list all files in the selected directory on the back-end side by passing the absolute path:

document.getElementById('folder-opener').addEventListener('change', function(event) {
  // Selected folder's absolute path:
  console.log(event.target.files[0].path);
});