Pagination displaying full buttons for paginating

Question

Currently, I am having a code for pagination and it is displaying all pages continuously

<div class="col-md-12">
  <nav aria-label="Page navigation">
    <ul class="pagination">
      <?php for ($i=0 ; $i < $products->totalPages; $i++) : ?>
      <li <?php if ($products->number == $i) echo "class='active'"; ?>>
        <a <?php if ($products->number != $i): ?> href="index.php?page=<?php echo $i . (isset($_GET['cid']) ? '&cid=' . $_GET['cid'] : ''); ?>#prdct" <?php endif; ?>><?php echo($i + 1); ?></a>
      </li>
      <?php endfor; ?>
    </ul>
  </nav>
</div>

Adding a screenshot showing how it will be now displaying:

What to do to make this comes in a single row?

Possible duplicate of [logic behind pagination like google](http://stackoverflow.com/questions/11272108/logic-behind-pagination-like-google) — Abhijit Jagtap, Dec 27 '16 at 05:27
Why would you display 90 page links like that? What if there were a million? A common solution is to show a link to a few pages before the current page and a link to a few pages after the current page. Then you'd have it all on the same line. But if you must display them all on the same row, use could use CSS to display a horizontal scroll bar. I'd advise against this and just put a page jump field. — Ultimater, Dec 27 '16 at 05:32
i need to limit the count of numbers. Currently it displaying full number of pages as you can see from the image, But i need to make it like [https://postimg.org/image/juxdsievz/] image is on that link — Gokul P P, Dec 27 '16 at 05:34
I'd suggest a framework to accomplish that as most already have built-in features to support that. For example I use zend framework for this: https://www.ultimater.net/test/pagination/page/9 You can also do this in Laravel: http://jslim.net/images/posts/2014-08-23-laravel-4-two-pagination-in-a-single-page/no-ajax.gif https://www.youtube.com/watch?v=Qeg3JcjdhMk — Ultimater, Dec 27 '16 at 05:45
You could also do this in JavaScript: https://esimakin.github.io/twbs-pagination/ (see the 2nd to last example) You can find the source here: https://github.com/esimakin/twbs-pagination/blob/master/jquery.twbsPagination.js The logic is pretty easy to follow (getPages contains most of the business logic), and shouldn't take long to convert over to another language like PHP. Or if you're using node.js, would be even easier to convert to back-end code. — Ultimater, Dec 27 '16 at 06:01

Pranav C Balan · Accepted Answer · 2016-12-30T06:46:24.583

You can implement using your own logic. Generate limited number of links based on the current page and total number of pages.

For example :

<div class="col-md-12">
    <nav aria-label="Page navigation">
        <ul class="pagination">
            <li <?php if ($products->number == 0) echo "class='active'"; ?>>
                <a <?php if ($products->number != 0): ?> href="index.php?page=0<?php echo(isset($_GET['cid']) ? '&cid=' . $_GET['cid'] : ''); ?>#prdct" <?php endif; ?>>1</a>
            </li>

            <?php if ($products->totalPages > 2) { ?>
                <?php if ($products->number > 3): ?><li><a href="javascript:void(0)">...</a></li><?php endif; ?>
                <?php for ($i = ($products->number == 0 ? 1 : $products->number-1); $i < $products->number+2  && $i < $products->totalPages - 1; $i++) { ?>
                    <li <?php if ($products->number == $i) echo "class='active'"; ?>>
                        <a <?php if ($products->number != $i): ?> href="index.php?page=<?php echo $i . (isset($_GET['cid']) ? '&cid=' . $_GET['cid'] : ''); ?>#prdct" <?php endif; ?>><?php echo($i + 1); ?></a>
                    </li>
                <?php } ?>
                <?php if ($products->number < $products->totalPages - 3): ?><li><a href="javascript:void(0)">...</a></li><?php endif; ?>
            <?php } ?>

            <?php if ($products->totalPages > 1): ?>
                <li <?php if ($products->number == $products->totalPages) echo "class='active'"; ?>>
                    <a <?php if ($products->number != $products->totalPages - 1): ?> href="index.php?page=<?php echo ($products->totalPages - 1) . (isset($_GET['cid']) ? '&cid=' . $_GET['cid'] : ''); ?>#prdct" <?php endif; ?>><?php echo $products->totalPages; ?></a>
                </li>
            <?php endif; ?>
        </ul>
    </nav>
</div>

Pagination displaying full buttons for paginating

1 Answers1