| 
 
 
 | 
| Keep Server Online 
 If you find the Apache Lounge, the downloads and overall help useful, please express your satisfaction with a donation.
 
 or
 
 
   
 A donation makes a contribution towards the costs, the time and effort that's going in this site and building.
 
 Thank You! Steffen
 
 Your donations will help to keep this site alive and well, and continuing building binaries. Apache Lounge is not sponsored.
 |  | 
 | 
| | 
| | 
|  Topic: Folder of images do not refresh |  |  
| Author |  |  
| benfringer 
 
 
 Joined: 13 Nov 2019
 Posts: 2
 
 
 | 
|  Posted: Wed 13 Nov '19 23:22    Post subject: Folder of images do not refresh |   |  
| 
 |  
| I am using this code 
 https://www.apachelounge.com/viewtopic.php?t=7995
 
 which works great when displaying one image.
 
 Now I have a folder of images where each image gets overwritten continousy. I am using the following code which works great if I have 1 image in the folder but as soon as the 2nd image is in the folder, the 2 images will display but they are not refreshing
 
 <script language="javascript">
 function updateImage() {
 obj = document.imagename;
 obj.src = obj.src.split("?")[0] + "?" + new Date().getTime();
 setTimeout("updateImage()",2000);
 }
 
 </script>
 
 <body onload="updateImage();">
 
 <?php
 $dirname = "thumbnail_preview";
 $images = glob($dirname."/*.png");
 
 foreach($images as $image) {
 echo "<img name='imagename' src=".$image."?t=".time().">";
 }
 ?>
 </div>
 
 Would anyone know how I can get this fixed?
 
 I have tried many samples of ajax refreshing divs but they all present a flash each time the images get auto refreshed
 |  |  
| Back to top |  |  
| mraddi 
 
 
 Joined: 27 Jun 2016
 Posts: 152
 Location: Schömberg, Baden-Württemberg, Germany
 
 | 
|  Posted: Thu 14 Nov '19 9:35    Post subject: |   |  
| 
 |  
| Hello Ben, 
 reason for not working with multiple images is, that you have multiple images with the same name. Therefore not a single object but an array is returned within line
 obj = document.imagename;
 To make it a little easier to understand and to make it clear that the result is an array (see the plural in getElementsByName) I used this:
 objs = document.getElementsByName('imagename');
 In addition I replaced the setTimeout(...) with a setInterval(...) outside the function so the result reads:
 
  	  | Code: |  	  | <html> <head>
 <script type="text/javascript">
 function updateImages() {
 objs = document.getElementsByName('imagename');
 let newDate = new Date().getTime();
 for(let i=0;i<objs.length;i++) {
 objs[i].src = objs[i].src.split("?")[0] + "?t=" + newDate;
 }
 }
 setInterval("updateImages()",2000);
 </script>
 </head>
 <body>
 <?php
 $dirname = ".";
 $images = glob($dirname."/*.png");
 
 foreach($images as $image) {
 echo '<img name="imagename" src="' . $image . '?t=' . time() . '">';
 }
 ?>
 </body>
 </html>
 | 
 
 Best regards
 Matthias
  |  |  
| Back to top |  |  
| benfringer 
 
 
 Joined: 13 Nov 2019
 Posts: 2
 
 
 | 
|  Posted: Thu 14 Nov '19 15:45    Post subject: |   |  
| 
 |  
| Thank you so much Matthias. 
 That works perfectly
 |  |  
| Back to top |  |  
 
 | 
 |  | 
 |  |