How to properly paginate a foreach loop

Question

I have a project I am working on, where I scan a directory and pull all of the images from the directory that will display the gallery images. Problem is, some galleries have 300+ images and this is causing a lag. I have looked around, but have not found a proper way of getting my code to paginate. Here is my code snippet of where I am running the foreach loop and getting each image source from the directory:

/** get the model's gallery
===================================================== **/
if(isset($_GET['count'])){
    $photo_count =  $_GET['count'];    
}
if(isset($_GET['model_dir'])){
    $model_dir = $_GET['model_dir'];

    /** get the higres gallery images
    ===================================================== **/
    $root_directory     = $_SERVER['DOCUMENT_ROOT'];
    $photo_directory    = "{$root_directory}/members/content/model_gallery/{$model_dir}";
    $gallery_list       = scandir($photo_directory);
    $gallery_list       = array_diff($gallery_list, array('.', '..'));
    foreach($gallery_list as $gallery){
        echo "
        <a href='{$index_url}join.php'>
        <img alt='' src='{$site_url}members/content/model_gallery/{$model_dir}/{$gallery}'
        data-image='{$site_url}members/content/model_gallery/{$model_dir}/{$gallery}'
        data-description=''>
        </a>
        "; 
    }  
}

Any ideas on how I could go about paginating this code would be greatly appreciated.

Answer 1

I solved the problem myself. For those who had something tangible to respond with, thanks for your help. For others who just wanted to critique code, not knowing what the full purpose of the code is and whether or not it is the final piece of code, should probably keep your input to yourself.

/** get the model's gallery
===================================================== **/
if(isset($_GET['count'])){
    $photo_count =  mysqli_real_escape_string($_GET['count']);    
}
if(isset($_GET['model_dir'])){
    $model_dir = mysqli_real_escape_string($_GET['model_dir']);
    /** get the higres gallery images
    ===================================================== **/
    $root_directory     = $_SERVER['DOCUMENT_ROOT'];
    $photo_directory    = "{$root_directory}/members/content/model_gallery/{$model_dir}";
    $gallery_list       = scandir($photo_directory);
    $gallery_list       = array_diff($gallery_list, array('.', '..'));
    $photo_count        = $photo_count;
    $gallery_limit      = 35;
    $qty_pages          = ceil($photo_count / $gallery_limit);
    if (isset($_GET["page"])) { $page  = $_GET["page"]; } else { $page=1; }
    $start_from         = $page * $gallery_limit  - $gallery_limit ;    
    $gallery_list       = array_slice($gallery_list,$start_from,$gallery_limit);
    echo "<div id='gallery'>";
    foreach($gallery_list as $gallery){
        echo "
        <a href='{$index_url}join.php'>
        <img alt='' src='{$site_url}members/content/model_gallery/{$model_dir}/{$gallery}'
        data-image='{$site_url}members/content/model_gallery/{$model_dir}/{$gallery}'
        data-description=''>
        </a>
        "; 
    }
    echo "</div>";
    echo "<div class='contain_pagination'>";
    if($photo_count != 0){
        echo "<nav class='contain_model_nav'><ul class='pagination'>";
        for ($i = 1; $i <= $qty_pages; $i++){
        echo "<li><a href='{$index_url}pages.php?id=gallerytour&model_dir={$model_dir}&count={$photo_count}&total={$total_photo_count}&page={$i}'></a>";
        echo  "</ul></nav>";
        }
    }
    echo "</div>";    
}
?>
<script type="text/javascript">
$(document).ready(function(){
    $('.pagination').pagination({
        items: <?php echo $photo_count;?>,
        itemsOnPage: <?php echo $gallery_limit;?>,
        cssStyle: 'light-theme',
        currentPage: <?php echo $page;?>,
        hrefTextPrefix: '<?php echo $index_url ?>pages.php?id=gallerytour&model_dir=<?php echo $model_dir; ?>&count=<?php echo $photo_count; ?>&total=<?php echo $total_photo_count; ?>&page='
    });
});
</script>

That is how I was able to paginate the foreach loop. I used nogad's idea for the array_slice function and then I used this open source for the pagination functionality: http://flaviusmatis.github.io/simplePagination.js/

From there I made sure I had the $photo_count, which contains the count of all images within the directory and essentially what I would be paginating through.

I then set my $gallery_limit per page, which was 35. From there, I determined the number of pages with $qty_pages and dividing by the total $photo_count / and the set $gallery_limit

Next I check if the page isset if it is, then $page is == to the $_GET[page] else it is $page is == 1.

Next I get the $start_from value by multiplying $page * $gallery_limit and then subtracting by $gallery_limit

Next I make the value for the $gallery_list which is an array = to array_slice($gallery_list,$start_from,$gallery_limit);

So my parameters within the function are the entire array of src images for the $gallery_list, the integer of where to start from, and the integer of the $gallery_limit, in this case I set it to a default of 35.

Next I check if $photo_count is != to 0 and then run my normal for loop. the parameters within the url for the anchor will be dependent obviously on your site. One thing to note, is to simply add the &page={$i} parameter to the end of your url.

Finally you use the pagination plugin to write a small jQuery script for the pagination functionality. You should be able to decipher what I did within the jQuery script. I hope this helps someone out, because I have looked at other answers, and none delivered a satisfied result. They were almost as moronic as people like OlegLoginov replying to your question.