1

How to pull multiple files using FileSystem Api (Html5) and send to javascript as an array. Actually I'm trying to select multiple files and add them to my slideshow.

Any help would be appreciated.

Regards --A.J

ALi Jay
  • 11
  • 8

1 Answers1

1

You need to add the multiple attribute to your input

 <input type="file" multiple />

You can also add webkitdirectory, directory, and/or mozdirectory to specify you want to allow users to upload entire folders. These are not standard, obviously (although plain ol' directory is/may be)

Then in your JavaScript, your input element will have a files array containing meta info on the selected files, ripe for using in the FileReader API. For example:

 <input type="file" multiple onchange="doSomethingWithThese(this.files)" />

(I don't recommend the inline JavaScript, just for example)

Matt Greer
  • 60,826
  • 17
  • 123
  • 123
  • Thanks Matt Let me try this I'll post the comment back. – ALi Jay Apr 27 '11 at 18:41
  • What I need now is the file path which i can add as array to the slideshow. – ALi Jay Apr 27 '11 at 21:14
  • You can't get the file path. But you can use the FileReader API to get a data url, then use the data url as the src of an image in your slide show. – Matt Greer Apr 27 '11 at 21:26
  • I've tried that but no joy, is there any possibility u could post any example here so that i can get the point. – ALi Jay Apr 27 '11 at 23:01
  • I've tried doing it here but it doesn't seem to be working for some reason. http://jsfiddle.net/j_cart007/QvXpt/ Could you please have a look at it and let me know what am I doing wrong. Thanks --A.J – ALi Jay Apr 27 '11 at 23:30
  • 2
    I can't find any evidence that "mozdirectory" works for Firefox. Chrome seems to be the only browser that currently supports this. – Dave Lancea Mar 28 '13 at 20:34