How to build a pagination with ellipsis

Viewed 3416

so, I read every related questions here but they were not what Im asking here so please if you feel this question is a duplicate consider some one new to PHP asking this who can't find any good answer and I'm also asking please do not down vote this maybe some one wants to help me. Thanks

btw this is my code for pagination:

<?php
$per_page = 10;

       if(isset($_GET['page'])){
        $page = $_GET['page'];
       } else {
         $page = 1;
       }

       if($page == "" || $page == 1) {
         $page_1 = 0;
       } else {
         $page_1 = ($page * $per_page) - $per_page;
       }
$item_count = "SELECT * FROM products";
    $find_count = mysqli_query($connection, $item_count);
    $count = mysqli_num_rows($find_count);
    $count_pages = ceil($count / $per_page) ;
?>

<ul class="pagination">
<?php
       for($i = 1; $i <= $count_pages; $i++){

        if($i == $page) {

          echo "<li><a class='active-page' href='./latest.php?page=$i'>$i</a></li>";

        } else {

          echo "<li><a href='./latest.php?page=$i'>$i</a></li>";
        }

        }   
        ?>  
</ul>

the code get the page number with a Get request and do a loop for number of pages. and pagination out put is like this :

1 2 3 4 5 6 7 8 9 10

but I dont want to display like above, I want to make this shorter with "..." , like this if the user is on page 3:

1 2 3 4 5 ... 9 10

or user is on page 9 :

1 2 ... 7 8 9 10

how can I manipulate this code to achieve this?

1 Answers

Hey there The Big Ash!

You're almost there already. You just need to check a couple of things:

is $i within two pages of the beginning or the end of the page count. That's easy, right?

if ($i <= 2 || $i >= $count_pages - 2)

is $i within two pages of the current page?

This is achieved with

if (abs($i - $page) <= 2)

So now the question remains: when to put the ellipsis?

If you just echo '...' every time the above conditions are not met, you'll just end up with a whole bunch of ellipses, right?

Also, it's possible that you'll need two ellipses (imagine there are 20 pages and you're on page 10. You'd want '1 2 ... 8 9 10 11 12 ... 19 20).

I'm sure there's a more elegant way to this, but I'd just use a flag ($outOfRange) which is set to false when any of the above conditions are met, but set to true when they are not. Then we echo '...' only when the conditions are not met but $outOfRange is still false. So we have:

$outOfRange = false;
for($i = 1; $i <= $count_pages; $i++) {

    if ($i <= 2 || $i >= $count_pages - 2 || abs($i - $page) <= 2) {

        // page number should be echoed so do as you did before

        $outOfRange = false;

        if($i == $page) {
            echo "<li><a class='active-page' href='./latest.php?page=$i'>$i</a></li>";
        } else {
            echo "<li><a href='./latest.php?page=$i'>$i</a></li>";
        }
    } else {

        // we are out of range! if not already out of range, echo ellipsis

        if (!$outOfRange) {
            echo ' ... ';
        }

        $outOfRange = true;

    }
} 
Related