How can i show the images in order in website with PHP and HTML?

Question

I added the images with image upload page and show the image and thumbnail images in another web page. I used the resize name with time() function. And I want this: I want each image I add to appear on the html page in order, according to the names I have just given. However, as I add the photos with the code I wrote, the order in my html page is distorted, but I always want it to continue in the order I added. How can I show the pictures I renamed with the Time() function in order on my html page?

home.php

                <div class ="gallery-items">
            <?php 
            $image_extensions = array("png","jpg","jpeg","gif");
            $dir = 'image/';
            if (is_dir($dir)){
                if ($dh = opendir($dir)){
                    while (($file = readdir($dh)) !== false){
                        if($file != '' && $file != '.' && $file != '..'){
                            $thumbnail_path = "image/thumbnailkamu/".$file;
                            $image_path = "image/".$file;
                            $thumbnail_ext = pathinfo($thumbnail_path, PATHINFO_EXTENSION);
                            $image_ext = pathinfo($image_path, PATHINFO_EXTENSION);
                if (array_key_exists('delete_file', $_POST)) {
                $filen = $_POST['delete_file'];
                if (file_exists("image/".$filen)){
                            unlink("image/".$filen);
                    unlink("image/thumbnailkamu/".$filen);

                             
                        }
                     }

                            if(!is_dir($image_path) && 
                                in_array($thumbnail_ext,$image_extensions) && 
                                in_array($image_ext,$image_extensions)){
                                ?>
                <div class ="item">
                                    <a href="<?= $image_path; ?>" data-lightbox="mygallery">
                                        <img src="<?= $thumbnail_path; ?>">
                                    </a>
                                    <a class="btn btn-primary" href="<?= $image_path; ?>" download>Download</a>
                    <form action = "" method="post">
                        <input type="hidden" value="<?= $file; ?>" name="delete_file" />
                        <input class = "button" type="submit"  value="Delete" />
                    </form>
                                </div>
                                <?php
                            }   
                        }
                        
                    }
                }
                    closedir($dh);
                }
            ?>
        </div>

Does this answer your question? [sort files by date in PHP](https://stackoverflow.com/questions/2667065/sort-files-by-date-in-php) — Kinglish, Jun 10 '21 at 18:59
I want the images to appear on the html page in the order I added them. When I try to fix my own code with the sort() functions, I break the code and it doesn't show any results. How can I integrate sort() functions into my code? Thanks. — abeo, Jun 10 '21 at 19:03

Kinglish · Accepted Answer · 2021-06-10T19:55:27.357

Since you're having trouble following the other S.O. answer, try this. First stick the files in an array with the filemtime as the key, then use ksort to sort it before you start iterating

<div class="gallery-items">
    <?php
$image_extensions = array("png", "jpg", "jpeg", "gif");
$dir = 'image/';
if (is_dir($dir)) {

    $thefiles = [];
    if ($dh = opendir($dir)) {
        while (($file = readdir($dh)) !== false) {
            if ($file != "" && $file != "." && $file != "..") {
                $thefiles[filemtime('image/' . $file)] = $file;
            }
        }
        closedir($dh);
    }
    // sort the by most recent at the top
    ksort($thefiles);

    // now loop through
    foreach ($thefiles as $file) {
        $thumbnail_path = "image/thumbnailkamu/" . $file;
        $image_path = "image/" . $file;
        $thumbnail_ext = pathinfo($thumbnail_path, PATHINFO_EXTENSION);
        $image_ext = pathinfo($image_path, PATHINFO_EXTENSION);
        if (array_key_exists('delete_file', $_POST)) {
            $filen = $_POST['delete_file'];
            if (file_exists("image/" . $filen)) {
                unlink("image/" . $filen);
                unlink("image/thumbnailkamu/" . $filen);

            }
        }

        if (!is_dir($image_path) &&
            in_array($thumbnail_ext, $image_extensions) &&
            in_array($image_ext, $image_extensions)) {
            ?>
    <div class="item">
        <a href="<?=$image_path;?>" data-lightbox="mygallery">
            <img src="<?=$thumbnail_path;?>">
        </a>
        <a class="btn btn-primary" href="<?=$image_path;?>" download>Download</a>
        <form action="" method="post">
            <input type="hidden" value="<?=$file;?>" name="delete_file" />
            <input class="button" type="submit" value="Delete" />
        </form>
    </div>
    <?php
}
    }

}

?>
</div>

I tried this, but there was a problem, it doesn't show all the images on the HTML page, it only shows whichever image I added last, and it changes on it as I add it, and there was no such problem in the other code. — abeo, Jun 10 '21 at 19:16
hmm. if you put `die('
'.print_r($thefiles,1).'
');` right after `ksort($thefiles);` does it only show one item? — Kinglish, Jun 10 '21 at 19:34
However, I had uploaded 4 images to the folder. It just shows the last one I installed. When I upload another image, even though the number is 5, only array 0 is shown again, this time it seems that only the last one I added. — abeo, Jun 10 '21 at 19:44
I just updated the answer - just this line changed: `$thefiles[filemtime('image/' . $file)] = $file;` — Kinglish, Jun 10 '21 at 19:55

How can i show the images in order in website with PHP and HTML?

1 Answers1