How do i reference to a folder? I'm want the photos in folder 'gallery1' to be shown when i click on it, this htm code is in the same directory with folder gallery1 i've done this:
<a href="gallery1" onclick="return false" onmousedown="ajax_json_gallery('gallery1')">Gallery 1</a><br>
but nothing shows when i click on it
I'm want the photos in folder 'gallery1'
So I assume that you have "Directory Browsing" enabled on the web server? If so, the way that you reference the folder is "/folderName" if the folder is one level from the root directory. Or the absolute URL would be http://www.domain.com/folder
I get this error Uncaught SyntaxError: Unexpected token < on this line
var d= JSON.parse(hr.responseText);
This is the whole code :
<html>
<head><title>Galeria fotove</title>
<style type="text/css">
body { margin:0px; background:#000; color:#CCC; }
div#pagetop { position:fixed; background: #333; padding:20px; font-size:36px; width:100%; border-bottom:#000 1px solid; }
div#thumbnailbox { float:left; margin-top:82px; width:120px; background:#292929; }
div#thumbnailbox > div { width:100px; height:80px; overflow:hidden; margin:10px; cursor:pointer; }
div#thumbnailbox > div > img { width:100px; }
div#pictureframe { position:fixed; left:140px; top:100px; width:700px; text-align:center; }
div#pictureframe > img { max-width:700px; }
div#albummenubox { position:fixed; left:856px; top:100px; width:200px; background:#CCC; padding:12px; color:#000; border-radius: 10px; }
</style>
<script type="text/javascript">
function ajax_json_gallery(folder){
var thumbnailbox = document.getElementById("thumbnailbox");
var pictureframe = document.getElementById("pictureframe");
var hr = new XMLHttpRequest();
hr.open("POST", "json_gallery_data.php", true);
hr.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
hr.onreadystatechange = function() {
if(hr.readyState == 4 && hr.status == 200) {
var d= JSON.parse(hr.responseText);
pictureframe.innerHTML = "<img src='"+d.img1.src+"'>";
thumbnailbox.innerHTML = "";
for(var o in d){
if(d[o].src){
thumbnailbox.innerHTML += '<div onclick="putinframe(\''+d[o].src+'\')"><img src="'+d[o].src+'"></div>';
}
}
}
}
hr.send("folder="+folder);
thumbnailbox.innerHTML = "requesting...";
}
function putinframe(src){
var pictureframe = document.getElementById("pictureframe");
pictureframe.innerHTML = '<img src="'+src+'">';
}
</script>
</head>
<body>
<div id="pagetop">Galeria fotove</div>
<div id="thumbnailbox"></div>
<div id="pictureframe"></div>
<div id="albummenubox">
<h3>Albumet</h3>
<a href="http://localhost:8080/agenda/tutorial/gallery1/" onclick="return false" onmousedown="ajax_json_gallery('gallery1')">Gallery 1</a><br>
<a href="http://localhost:8080/agenda/tutorial/gallery2/" onclick="return false" onmousedown="ajax_json_gallery('gallery2')">Gallery 2</a><br>
<a href="#" onclick="return false" onmousedown="ajax_json_gallery('gallery3')">Gallery 3</a><br>
</div>
<script type="text/javascript">ajax_json_gallery('gallery1');</script>
</body>
</html>
No one knows this? :(
What is hr.responseText returning?
This will generate all the images in a folder
OK, maybe I need to be clearer. What is hr.responseText returning when you get the error, what is it's actual value?
We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.