How to locate all images in a directory using jQuery

Question

I'm developing an application which runs on a localhost server.! In this application I do ajax calls and get items from a local h2 DB! Using the response I create dynamic elements using jQuery. The elements use an item image as background and the requirement is that I should get the images from a local folder. ( The folder is created when the server is first started and the images are synchronized from a main server over the intranet. ) The folder hierarchy is shown below.

c:/----
      |
      zharaimages/ -----
                       |
                       [item id]/-----
                                     |
                                     [image].jpg

The image can contain any name for it but will be a jpg. How can I read the file system using jQuery to get the necessary image file when the item is dynamically loaded. I thought of this method but for that I can only read a file with a static name. I want to write a method where the image name can be anything.

clone.css('background-image','c:/zharaimages/' + items[i].itemId + '/image.jpg');

Any ideas or plugins are welcome. Thank you.

update

This is a deployable application which uses an embedded jetty server. The folders are in the same computer as the application is!

The fact that the server and browser happen to be running on the same computer does not mean that the browser suddenly has access to read files from the user's local hard drive. — Phrogz, Jun 21 '13 at 06:40

score 3 · Answer 1 · answered Jun 21 '13 at 04:16

3

jQuery runs on the browser.

The files are on the server.

The only way that jQuery can read the files on the server is if it makes an AJAX call to the server, and your web server enumerates them.

answered Jun 21 '13 at 04:16

Phrogz

296,393
112
651
745

The file are on the local computer where the server runs! it's a diployable application which runs on a jetty server. – Imesh Chandrasiri Jun 21 '13 at 04:20

score 3 · Accepted Answer · edited May 23 '17 at 10:32

Unfortunately a big NOOOOOO...

javaScripts cannot read or write files on users' computers (File API - not currently supported by many browsers - allows files to be read by scripts if the user specifically chooses to allow it),

though they can cause the browser to load remote pages and resources like scripts or images, which the browser may choose to cache locally.

They cannot create files on the server (except by communicating with a server side script that creates files for them).

You have to make a server request(many ways...) for the resources.

I'm not sure weather its possible with HTML5 or not

How to locate all images in a directory using jQuery

2 Answers2