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?
Related
I'm writing some html that links to a server to download a file. The location always remains the same, however, the file name gets updated.
Basically the link is like this:
http://www.somedomain.com/somedir/dir/filename_revA.pdf
The filename will often get revised ("filename_revB.pdf") for example. My goal would not having to change the html href code each time this happens.
TL;DR-- I want to be able to reference an url, ie: 'http://www.somedomain.com/somedir/dir/'
but not need the filename to fetch the file that is there after the last /.
Would RegEx (javascript) be best solution or a better method? Sorry if it's been asked I tried searching couldn't quite get what I wanted- requesting a URL WITHOUT the filename needed-while still fetching the actual file that's there. There's only one file that is there at all times, but perhaps to be safer using part of the name since only the last part changes?
edit- I don't have access to the server that hosts the file(s).
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 am building a application for the first time in node.
My website will include a static list of countries, music genres and so on...
Should I store the data in my database, or should I use a static json file with a list(countries, genre)?
My folder structure looks something like src\lib..scsss..server and so on.
My question ultimately is - Is there a best practice for storing static lists in node - if a josn file is preferred where should this exist in my folder structure?
If your data is not gonna change and static, then you should use file system which will have high R/W operation rate compared to communication with DB Server overhead.
Moreover you can use filecache to cache all your static files. Which will load the files even faster.
The answer is really that "it depends" upon some things you have not specified.
First off, if it is a list of data that does not change while your app is running (or changes very infrequently), then you don't want to load it from some remote source every time you need it. You will want to load it once and then keep that list in memory for subsequent use. This will be a lot more efficient for your server.
As to where to store the list in the first place, you have several choices that depend upon who is going to maintain that list and what level of programming skill they might have.
If the list of countries will not change often and will be maintained by a Javascript developer, then you can either put the list right into a Javascript literal in your code or in a JSON file in your file system. If choosing the latter option as a JSON file, it can be in the same directory as your Javascript source files and just loaded directly with require() upon startup.
If the list of countries will be maintained by someone who is not a Javascript developer, but can be trusted to follow JSON syntax rules, then you can put the list in a JSON file. Whether you put this file in the same directory as your JS files or in a separate data directory really depends more upon how your application is deployed, who has permission to do what, etc...
If the list of countries will be maintained by someone who has no idea about programming or syntax rules and should be modifiable completely independently from your code, then you may want to either put it in the database and build some sort of admin interface for modifying it or put it in a plain text file (one country per line) and then parse that file upon app startup.
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.
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.