Hi,
For my project I m using jquery bulit in photo slide show,jquery code is taking images from array and displaying the images..The problem is I have a lot of images which I don't want to put it in Array(because it need manual effort) instead of that I want to read each image from the folder and display the images. the advantage of doing so is whenever you want to add more images you need to drop it in folder since you are reading images from folder so need not to do any thing in code level.so it makes your work easier and simpler.. so is there any way to achieve the same using javascript?.
Thanks in Adavance.
Javascript being client-side, it's possible to list the content of a server directory with it. You'll need some server side scripting to do that, like PHP.
see this SO question for an example
I think you should add an Ajax request to get the names of file in the directory.
After you can just pass along the array and show only those images in the slideshow.
Related
Let's say I have a folder of about 100 images on my website called "IMG"
Now let's say I have a div element: <div id="templateDiv"></div>
Using javascript, how would I add all images from "IMG/" into that div without adding <img src="IMG/IMGNAME.jpg"> for every image?
Sorry, I'm not very good at explaining.
Just ignore the fact that would take ages to load.
EDIT
Ok my bad explanation skills have made me change my question.
How do I automatically make array of all files in website directory?
Okay, your question is incredibly unclear, but from reading all your other comments and things, it seems you simply want to get an array that contains the filename of every file in a directory? If that's what you want, then it won't be possible (I don't believe) since only the server knows which files are where, and you can't request the contents of a directory from a server using JavaScript.
However if you were using Node.js on a local directory, then it could be done. But I don't believe that's your case.
That being said, you have three alternative options:
Name every image file 1.png, 2.png, 3.png, etc. Then use a for loop and get each one using (i + 1) + ".png"
If you can't rename the files, but the files are named via user input, you could collect the user's input at the time of file creation and add the name of the newly created file into another file/an array/localStorage so that it could be retrieved later.
If you can't rename the files, but the filenames are also never known to the program that needs them, then you could create an array of all the filenames (manually) and iterate over that to find all the files that you want.
Please, somebody let me know if I'm wrong and if there actually is a way to make a request to a server that tells the client all the files in a directory. That seems incredibly unlikely though.
Another potential solution just came to mind. You could write a PHP script (or Node.js or any server-side language, really) that scans a directory, creates a list of all the filenames there, and then sends that back over HTTP. Then you could simply make an XMLHttpRequest to that PHP file and have it do the work. How does that sound?
I know this is very a general question but I am failing to show a file in Angular 2 after upload. Although a file is existed on folder. It showing when I restarted angular.
Source tree my project
upload folder is saving image uploaded
Have you try to empty your cache before building again ?
Images are pretty often kept in the cache, so you should have a look there.
Also you might want to create a folder that you can access easily from any component for things like images. For example if you use Angular-Cli, check the assets part.
https://github.com/angular/angular-cli/wiki/stories-asset-configuration
Well, it should be something like :
<img alt="Alternative" [src]="'./upload/yourImage.something'">
If you are trying to use the image in app.component.ts or app.component.html.
But it's pretty hard to find what's wrong since you don't show your code.
I need to dynamically load all images in a given directory from the server using javascript. I don't know in advance the number of files in the directory, neither their names. What is the correct way for doing this. Should I first send a request with ajax to get their names ? or is there another way. By the way, I'm using Django, and the images are in my static directory, though I don't think this information makes a difference.
I'm thinking of doing some online file manipulation for mobile users, the idea being that the user provides a URL to the file, then the file contents are modified by the JS, and can then be downloaded. But I haven't been able to figure out how to get the file when it's on a separate domain using just JS.
Is this possible? If so any hints or examples would be appreciated.
Just wanted to add that part of what I wanted to do was make it available without my hosting it. I'm thinking of something like a a file they can host somewhere,and then all of the bandwidth is their own...and that of wherever they are getting the file from of course.
The only way to load contents of a file on another domain is from within a <script> tag. This is how JSONP works. Look into getting your target file into this format.
The other way would be to use a local proxy. Create a web service method that loads and returns the contents of the file, then call that locally using your favorite JavaScript framework.
Depending on how you think of public webservices, and within some limitations I'm still mapping, you can do this using an ajax call to YQL, like so.
(will expand the answer later).
http://query.yahooapis.com/v1/public/yql?q=select%20%2a%20from%20data.uri%20where%20url=%22http://t3.gstatic.com/images?q=tbn:ANd9GcSyART8OudfFJQ5oBplmhZ6HIIlougzPgwQ9qcgknK8_tivdW0EOg%22
One of the limitations of this method is file size, it currently tops out at 25k.
Is it possible to use Javascript to list all the files contained in a subfolder?
I have a bunch of images that need to be linked too, but I would like it to be dynamic because the list will be changing a lot.
Thankyou!!!
Is it possible to use Javascript to list all the files contained in a subfolder?
No. You would usually set up a simple server side script that does the listing (e.g. using PHP's glob()), and output a JSON array, for example.