72

Laravel 4.2 has the option to specify a custom view in app/config/view.php such as:

/*
|--------------------------------------------------------------------------
| Pagination View
|--------------------------------------------------------------------------
|
| This view will be used to render the pagination link output, and can
| be easily customized here to show any view you like. A clean view
| compatible with Twitter's Bootstrap is given to you by default.
|
*/
'pagination' => 'pagination_slider-alt'

This is gone in Laravel 5 at least regarding view.php.

Is there a way to replicate this behavior in Laravel 5?

user2094178
  • 9,204
  • 10
  • 41
  • 70

24 Answers24

158

In Laravel 5.3+ use

$users->links('view.name')

In Laravel 5.0 - 5.2 instead of

$users->render()

use

@include('pagination.default', ['paginator' => $users])

views/pagination/default.blade.php

@if ($paginator->lastPage() > 1)
<ul class="pagination">
    <li class="{{ ($paginator->currentPage() == 1) ? ' disabled' : '' }}">
        <a href="{{ $paginator->url(1) }}">Previous</a>
    </li>
    @for ($i = 1; $i <= $paginator->lastPage(); $i++)
        <li class="{{ ($paginator->currentPage() == $i) ? ' active' : '' }}">
            <a href="{{ $paginator->url($i) }}">{{ $i }}</a>
        </li>
    @endfor
    <li class="{{ ($paginator->currentPage() == $paginator->lastPage()) ? ' disabled' : '' }}">
        <a href="{{ $paginator->url($paginator->currentPage()+1) }}" >Next</a>
    </li>
</ul>
@endif

That's it.


If you have a lot of pages, use this template:

views/pagination/limit_links.blade.php

<?php
// config
$link_limit = 7; // maximum number of links (a little bit inaccurate, but will be ok for now)
?>

@if ($paginator->lastPage() > 1)
    <ul class="pagination">
        <li class="{{ ($paginator->currentPage() == 1) ? ' disabled' : '' }}">
            <a href="{{ $paginator->url(1) }}">First</a>
         </li>
        @for ($i = 1; $i <= $paginator->lastPage(); $i++)
            <?php
            $half_total_links = floor($link_limit / 2);
            $from = $paginator->currentPage() - $half_total_links;
            $to = $paginator->currentPage() + $half_total_links;
            if ($paginator->currentPage() < $half_total_links) {
               $to += $half_total_links - $paginator->currentPage();
            }
            if ($paginator->lastPage() - $paginator->currentPage() < $half_total_links) {
                $from -= $half_total_links - ($paginator->lastPage() - $paginator->currentPage()) - 1;
            }
            ?>
            @if ($from < $i && $i < $to)
                <li class="{{ ($paginator->currentPage() == $i) ? ' active' : '' }}">
                    <a href="{{ $paginator->url($i) }}">{{ $i }}</a>
                </li>
            @endif
        @endfor
        <li class="{{ ($paginator->currentPage() == $paginator->lastPage()) ? ' disabled' : '' }}">
            <a href="{{ $paginator->url($paginator->lastPage()) }}">Last</a>
        </li>
    </ul>
@endif
Mantas D
  • 3,993
  • 3
  • 26
  • 26
58

For Laravel 5.3 (and may be in other 5.X versions) put custom pagination code in you view folder.

resources/views/pagination/default.blade.php

@if ($paginator->hasPages())
    <ul class="pagination">
        {{-- Previous Page Link --}}
        @if ($paginator->onFirstPage())
            <li class="disabled"><span>&laquo;</span></li>
        @else
            <li><a href="{{ $paginator->previousPageUrl() }}" rel="prev">&laquo;</a></li>
        @endif

        {{-- Pagination Elements --}}
        @foreach ($elements as $element)
            {{-- "Three Dots" Separator --}}
            @if (is_string($element))
                <li class="disabled"><span>{{ $element }}</span></li>
            @endif

            {{-- Array Of Links --}}
            @if (is_array($element))
                @foreach ($element as $page => $url)
                    @if ($page == $paginator->currentPage())
                        <li class="active"><span>{{ $page }}</span></li>
                    @else
                        <li><a href="{{ $url }}">{{ $page }}</a></li>
                    @endif
                @endforeach
            @endif
        @endforeach

        {{-- Next Page Link --}}
        @if ($paginator->hasMorePages())
            <li><a href="{{ $paginator->nextPageUrl() }}" rel="next">&raquo;</a></li>
        @else
            <li class="disabled"><span>&raquo;</span></li>
        @endif
    </ul>
@endif

then call this pagination view file from the main view file as

{{ $posts->links('pagination.default') }}

Update the pagination/default.blade.php however you want

It works in 8.x versions as well.

Joyal
  • 2,587
  • 3
  • 30
  • 45
  • 6
    Your's is the only one, that does not fall under: "Lets make simple thing in the most loathsome and difficult way, just to prove our coding prowess." ;))) And Laracast's Jeff Way seems to agree with you ... Keep It Simple people!!! (when on L5.3+) – Jeffz Sep 06 '17 at 19:33
  • Work good at laravel 5.8 – Trần Hữu Hiền Oct 19 '21 at 06:29
23

In Laravel 5 custom pagination is based on presenters (classes) instead of views.

Assuming in your routed code you have

$users = Users::paginate(15);

In L4 you used to do something like this in your views:

$users->appends(['sort' => 'votes'])->links();

In L5 you do instead:

$users->appends(['sort' => 'votes'])->render();

The render() method accepts an Illuminate\Contracts\Pagination\Presenter instance. You can create a custom class that implements that contract and pass it to the render() method. Note that Presenter is an interface, not a class, therefore you must implement it, not extend it. That's why you are getting the error.

Alternatively you can extend the Laravel paginator (in order to use its pagination logic) and then pass the existing pagination instance ($users->...) to you extended class constructor. This is indeed what I did for creating my custom Zurb Foundation presenter based on the Bootstrap presenter provided by Laravel. It uses all the Laravel pagination logic and only overrides the rendering methods.

With my custom presenter my views look like this:

with(new \Stolz\Laravel\Pagination($users->appends(['sort' => 'votes'])))->render();

And my customized pagination presenter is:

<?php namespace Stolz\Laravel;

use Illuminate\Pagination\BootstrapThreePresenter;

class Pagination extends BootstrapThreePresenter
{
    /**
     * Convert the URL window into Zurb Foundation HTML.
     *
     * @return string
     */
    public function render()
    {
        if( ! $this->hasPages())
            return '';

        return sprintf(
            '<ul class="pagination" aria-label="Pagination">%s %s %s</ul></div>',
            $this->getPreviousButton(),
            $this->getLinks(),
            $this->getNextButton()
        );
    }

    /**
     * Get HTML wrapper for disabled text.
     *
     * @param  string  $text
     * @return string
     */
    protected function getDisabledTextWrapper($text)
    {
        return '<li class="unavailable" aria-disabled="true"><a href="javascript:void(0)">'.$text.'</a></li>';
    }

    /**
     * Get HTML wrapper for active text.
     *
     * @param  string  $text
     * @return string
     */
    protected function getActivePageWrapper($text)
    {
        return '<li class="current"><a href="javascript:void(0)">'.$text.'</a></li>';
    }

    /**
     * Get a pagination "dot" element.
     *
     * @return string
     */
    protected function getDots()
    {
        return $this->getDisabledTextWrapper('&hellip;');
    }
}
Javi Stolz
  • 4,720
  • 1
  • 30
  • 27
  • In what folder does this customized presenter live in your project? – moraleida Jun 25 '15 at 04:20
  • 1
    @moraleida, in any folder that is under Composer domain. You can follow prs0, psr4,... Just make sure you address it using the right namespace – Javi Stolz Jun 25 '15 at 07:16
15

In 5.5 links() is replaced with render() which appears to work similarly. [Official DOC]

replace

{{ $replies->links() }}

with

{{ $replies->render("pagination::default") }}

Following commands will generate Pagination template in resources/views/vendor/pagination

artisan vendor:publish --tag=laravel-pagination
artisan vendor:publish

In any view file (blade files) you can use those template like following ex:

  • {{ $replies->render("pagination::default") }}
  • {{ $replies->render("pagination::bootstrap-4") }}
  • {{ $replies->render("pagination::simple-bootstrap-4") }}
  • {{ $replies->render("pagination::semantic-ui") }}
Vikas Dwivedi
  • 5,233
  • 1
  • 21
  • 16
14

Whereas in Laravel 4.2 I would use:

{{ $users->links('view.name') }}

In Laravel 5 you can replicate the above with the following:

@include('view.name', ['object' => $users])

Now in the included view, $object will have the pagination methods available, such as currentPage(), lastPage(), perPage(), etc.

You can view all methods available at http://laravel.com/docs/5.0/pagination

user2094178
  • 9,204
  • 10
  • 41
  • 70
  • Thanks for the @include pointer - that's exactly what I needed to know. –  Apr 10 '15 at 02:52
7

Laravel 5 ships with a Bootstrap 4 paginator if anyone needs it.

First create a new service provider.

php artisan make:provider PaginationServiceProvider

In the register method pass a closure to Laravel's paginator class that creates and returns the new presenter.

<?php


namespace App\Providers;

use Illuminate\Pagination\BootstrapFourPresenter;
use Illuminate\Pagination\Paginator;
use Illuminate\Support\ServiceProvider;

class PaginationServiceProvider extends ServiceProvider
{
    /**
     * Bootstrap the application services.
     *
     * @return void
     */
    public function boot()
    {
        //
    }

    /**
     * Register the application services.
     *
     * @return void
     */
    public function register()
    {
        Paginator::presenter(function($paginator)
        {
            return new BootstrapFourPresenter($paginator);
        });
    }
}

Register the new provider in config/app.php

'providers' => [
    //....
    App\Providers\PaginationServiceProvider::class,
]

I found this example at Bootstrap 4 Pagination With Laravel

Morgan O'Neal
  • 1,108
  • 1
  • 12
  • 20
  • 2
    Presenters aren't used anymore since this commit: https://github.com/laravel/framework/commit/c8d1b189c581824b18b2ddec6a1d2c225871858b To make this work, replace `Paginator::presenter(function($paginator) { return new BootstrapFourPresenter($paginator); });` with `Paginator::$defaultView = 'pagination::bootstrap-4'; Paginator::$defaultSimpleView = 'pagination::bootstrap-4';` – pbond Dec 13 '16 at 14:56
5

Maybe it is too late, but I would like to share another custom pagination template I made that creates a first/next and last/previous links. It also hides the links when the user is in the first/last page already.

(Optional) You can also determine the interval of links (the number of links before and after the current page)

Usage example:

 @include('pagination', ['paginator' => $users])

or

@include('pagination', ['paginator' => $users, 'interval' => 5])

Here is the gist: https://gist.github.com/carloscarucce/33f6082d009c20f77499252b89c35dea

And the code:

@if (isset($paginator) && $paginator->lastPage() > 1)

    <ul class="pagination">

        <?php
        $interval = isset($interval) ? abs(intval($interval)) : 3 ;
        $from = $paginator->currentPage() - $interval;
        if($from < 1){
            $from = 1;
        }

        $to = $paginator->currentPage() + $interval;
        if($to > $paginator->lastPage()){
            $to = $paginator->lastPage();
        }
        ?>

        <!-- first/previous -->
        @if($paginator->currentPage() > 1)
            <li>
                <a href="{{ $paginator->url(1) }}" aria-label="First">
                    <span aria-hidden="true">&laquo;</span>
                </a>
            </li>

            <li>
                <a href="{{ $paginator->url($paginator->currentPage() - 1) }}" aria-label="Previous">
                    <span aria-hidden="true">&lsaquo;</span>
                </a>
            </li>
        @endif

        <!-- links -->
        @for($i = $from; $i <= $to; $i++)
            <?php 
            $isCurrentPage = $paginator->currentPage() == $i;
            ?>
            <li class="{{ $isCurrentPage ? 'active' : '' }}">
                <a href="{{ !$isCurrentPage ? $paginator->url($i) : '#' }}">
                    {{ $i }}
                </a>
            </li>
        @endfor

        <!-- next/last -->
        @if($paginator->currentPage() < $paginator->lastPage())
            <li>
                <a href="{{ $paginator->url($paginator->currentPage() + 1) }}" aria-label="Next">
                    <span aria-hidden="true">&rsaquo;</span>
                </a>
            </li>

            <li>
                <a href="{{ $paginator->url($paginator->lastpage()) }}" aria-label="Last">
                    <span aria-hidden="true">&raquo;</span>
                </a>
            </li>
        @endif

    </ul>

@endif
CarlosCarucce
  • 3,420
  • 1
  • 28
  • 51
3

A quick JS fix for Bootstrap 4 pagination in Laravel 5+

Simply place the below script within your page:

    <script>
            $('.pagination li').addClass('page-item');
            $('.pagination li a').addClass('page-link');
            $('.pagination span').addClass('page-link');

    </script>

Advantages: saves server CPU, needs no adjustments in your app.

Peter
  • 2,634
  • 7
  • 32
  • 46
3

Laravel 5.2 uses presenters for this. You can create custom presenters or use the predefined ones. Laravel 5.2 uses the BootstrapThreePrensenter out-of-the-box, but it's easy to use the BootstrapFroutPresenter or any other custom presenters for that matter.

public function index()
{
    return view('pages.guestbook',['entries'=>GuestbookEntry::paginate(25)]);
}

In your blade template, you can use the following formula:

{!! $entries->render(new \Illuminate\Pagination\BootstrapFourPresenter($entries)) !!}

For creating custom presenters I recommend watching Codecourse's video about this.

Meki
  • 395
  • 1
  • 7
  • 13
3

if you want to beautify the appearance of your pagination, I use the class from bootstrap to make it more simple and easy

 @if ($students->lastPage() > 1)
        <ul class="pagination ml-auto">
            <li class="{{ ($students->currentPage() == 1) ? ' disabled' : '' }} page-item">
                <a class=" page-link " href="{{ $students->url(1) }}" aria-label="Previous">
                    <span aria-hidden="true">&laquo;</span>
                    <span class="sr-only">Previous</span>
                </a>
            </li>
            @for ($i = 1; $i <= $students->lastPage(); $i++)
                <li class="{{ ($students->currentPage() == $i) ? ' active' : '' }} page-item">
                    <a class=" page-link " href="{{ $students->url($i) }}">{{ $i }}</a>
                </li>
            @endfor
            <li class="{{ ($students->currentPage() == $students->lastPage()) ? ' disabled' : '' }} page-item">
                <a href="{{ $students->url($students->currentPage()+1) }}" class="page-link" aria-label="Next">
                    <span aria-hidden="true">&raquo;</span>
                    <span class="sr-only">Next</span>
                </a>
            </li>
        </ul>
@endif
2

Hi there is my code for pagination: Use in blade @include('pagination.default', ['paginator' => $users])

Views/pagination/default.blade.php

@if ($paginator->lastPage() > 1)

si la pagina actual es distinto a 1 y hay mas de 5 hojas muestro el boton de 1era hoja --> if actual page is not equals 1, and there is more than 5 pages then I show first page button --> @if ($paginator->currentPage() != 1 && $paginator->lastPage() >= 5) << @endif
    <!-- si la pagina actual es distinto a 1 muestra el boton de atras -->
    @if($paginator->currentPage() != 1)
        <li>
            <a href="{{ $paginator->url($paginator->currentPage()-1) }}" >
                <
            </a>
        </li>
    @endif

    <!-- dibuja las hojas... Tomando un rango de 5 hojas, siempre que puede muestra 2 hojas hacia atras y 2 hacia adelante -->
    <!-- I draw the pages... I show 2 pages back and 2 pages forward -->
    @for($i = max($paginator->currentPage()-2, 1); $i <= min(max($paginator->currentPage()-2, 1)+4,$paginator->lastPage()); $i++)
            <li class="{{ ($paginator->currentPage() == $i) ? ' active' : '' }}">
                <a href="{{ $paginator->url($i) }}">{{ $i }}</a>
            </li>
    @endfor

    <!-- si la pagina actual es distinto a la ultima muestra el boton de adelante -->
    <!-- if actual page is not equal last page then I show the forward button-->
    @if ($paginator->currentPage() != $paginator->lastPage())
        <li>
            <a href="{{ $paginator->url($paginator->currentPage()+1) }}" >
                >
            </a>
        </li>
    @endif

    <!-- si la pagina actual es distinto a la ultima y hay mas de 5 hojas muestra el boton de ultima hoja -->
    <!-- if actual page is not equal last page, and there is more than 5 pages then I show last page button -->
    @if ($paginator->currentPage() != $paginator->lastPage() && $paginator->lastPage() >= 5)
        <li>
            <a href="{{ $paginator->url($paginator->lastPage()) }}" >
                >>
            </a>
        </li>
    @endif
</ul>
diego
  • 21
  • 2
2

I am using Laravel 5.8. Task was to make pagination like next http://some-url/page-N instead of http://some-url?page=N. It cannot be accomplished by editing /resources/views/vendor/pagination/blade-name-here.blade.php template (it could be generated by php artisan vendor:publish --tag=laravel-pagination command). Here I had to extend core classes.

My model used paginate method of DB instance, like next:

        $essays = DB::table($this->table)
        ->select('essays.*', 'categories.name', 'categories.id as category_id')
        ->join('categories', 'categories.id', '=', 'essays.category_id')
        ->where('category_id', $categoryId)
        ->where('is_published', $isPublished)
        ->orderBy('h1')
        ->paginate( // here I need to extend this method
            $perPage,
            '*',
            'page',
            $page
        );

Let's get started. paginate() method placed inside of \Illuminate\Database\Query\Builder and returns Illuminate\Pagination\LengthAwarePaginator object. LengthAwarePaginator extends Illuminate\Pagination\AbstractPaginator, which has public function url($page) method, which need to be extended:

    /**
 * Get the URL for a given page number.
 *
 * @param  int  $page
 * @return string
 */
public function url($page)
{
    if ($page <= 0) {
        $page = 1;
    }

    // If we have any extra query string key / value pairs that need to be added
    // onto the URL, we will put them in query string form and then attach it
    // to the URL. This allows for extra information like sortings storage.
    $parameters = [$this->pageName => $page];

    if (count($this->query) > 0) {
        $parameters = array_merge($this->query, $parameters);
    }

    // this part should be overwrited
    return $this->path 
        . (Str::contains($this->path, '?') ? '&' : '?')
        . Arr::query($parameters)
        . $this->buildFragment();
}

Step by step guide (part of information I took from this nice article):

  1. Create Extended folder in app directory.
  2. In Extended folder create 3 files CustomConnection.php, CustomLengthAwarePaginator.php, CustomQueryBuilder.php:

2.1 CustomConnection.php file:

namespace App\Extended;

use \Illuminate\Database\MySqlConnection;

/**
 * Class CustomConnection
 * @package App\Extended
 */
class CustomConnection extends MySqlConnection {
    /**
     * Get a new query builder instance.
     *
     * @return \App\Extended\CustomQueryBuilder
     */
    public function query() {
        // Here core QueryBuilder is overwrited by CustomQueryBuilder
        return new CustomQueryBuilder(
            $this,
            $this->getQueryGrammar(),
            $this->getPostProcessor()
        );
    }
}

2.2 CustomLengthAwarePaginator.php file - this file contains main part of information which need to be overwrited:

namespace App\Extended;

use Illuminate\Pagination\LengthAwarePaginator;
use Illuminate\Support\Arr;
use Illuminate\Support\Str;

/**
 * Class CustomLengthAwarePaginator
 * @package App\Extended
 */
class CustomLengthAwarePaginator extends LengthAwarePaginator
{
    /**
     * Get the URL for a given page number.
     * Overwrited parent class method
     *
     *
     * @param  int  $page
     * @return string
     */
    public function url($page)
    {
        if ($page <= 0) {
            $page = 1;
        }

        // here the MAIN overwrited part of code BEGIN
        $parameters = [];

        if (count($this->query) > 0) {
            $parameters = array_merge($this->query, $parameters);
        }

        $path =  $this->path . "/{$this->pageName}-$page";
        // here the MAIN overwrited part of code END

        if($parameters) {
            $path .= (Str::contains($this->path, '?') ? '&' : '?') . Arr::query($parameters);
        }

        $path .= $this->buildFragment();

        return $path;
    }
}

2.3 CustomQueryBuilder.php file:

namespace App\Extended;

use Illuminate\Container\Container;
use \Illuminate\Database\Query\Builder;

/**
 * Class CustomQueryBuilder
 * @package App\Extended
 */
class CustomQueryBuilder extends Builder
{
    /**
     * Create a new length-aware paginator instance.
     * Overwrite paginator's class, which will be used for pagination
     *
     * @param  \Illuminate\Support\Collection  $items
     * @param  int  $total
     * @param  int  $perPage
     * @param  int  $currentPage
     * @param  array  $options
     * @return \Illuminate\Pagination\LengthAwarePaginator
     */
    protected function paginator($items, $total, $perPage, $currentPage, $options)
    {
        // here changed
        // CustomLengthAwarePaginator instead of LengthAwarePaginator
        return Container::getInstance()->makeWith(CustomLengthAwarePaginator::class, compact(
            'items', 'total', 'perPage', 'currentPage', 'options'
        ));
    }
}
  1. In /config/app.php need to change db provider:

    'providers' => [
    
    
    // comment this line        
    // illuminate\Database\DatabaseServiceProvider::class,
    
    // and add instead:
    App\Providers\CustomDatabaseServiceProvider::class,
    
  2. In your controller (or other place where you receive paginated data from db) you need to change pagination's settings:

    // here are paginated results
    $essaysPaginated = $essaysModel->getEssaysByCategoryIdPaginated($id, config('custom.essaysPerPage'), $page);
    // init your current page url (without pagination part)
    // like http://your-site-url/your-current-page-url
    $customUrl = "/my-current-url-here";
    // set url part to paginated results before showing to avoid 
    // pagination like http://your-site-url/your-current-page-url/page-2/page-3 in pagination buttons
    $essaysPaginated->withPath($customUrl);
    
  3. Add pagination links in your view (/resources/views/your-controller/your-blade-file.blade.php), like next:

    <nav>
        {!!$essays->onEachSide(5)->links('vendor.pagination.bootstrap-4')!!}
    </nav>
    

ENJOY! :) Your custom pagination should work now

Vaha
  • 2,179
  • 2
  • 17
  • 29
1

Here's one for Laravel 5, Bootstrap 4 and without Blade syntax (for those who find it infinitely harder to read).

To use, instead of:

{!! $users->render() !!}

Use:

@include('partials/pagination', ['paginator' => $users])

Where partials/pagination is your blade template file with the below contents pasted in.

// Number of links to show. Odd numbers work better
$linkCount = 7;
$pageCount = $paginator->lastPage();

if ($pageCount > 1)
{
    $currentPage = $paginator->currentPage();
    $pagesEitherWay = floor($linkCount / 2);
    $paginationHtml = '<ul class="pagination">';

    // Previous item
    $previousDisabled = $currentPage == 1 ? 'disabled' : '';
    $paginationHtml .= '<li class="page-item '.$previousDisabled.'">
                            <a class="page-link" href="'.$paginator->url($currentPage - 1).'" aria-label="Previous">
                                <span aria-hidden="true">&laquo;</span>
                                <span class="sr-only">Previous</span>
                            </a>
                        </li>';

    // Set the first and last pages
    $startPage = ($currentPage - $pagesEitherWay) < 1 ? 1 : $currentPage - $pagesEitherWay;
    $endPage = ($currentPage + $pagesEitherWay) > $pageCount ? $pageCount : ($currentPage + $pagesEitherWay);

    // Alter if the start is too close to the end of the list
    if ($startPage > $pageCount - $linkCount)
    {
        $startPage = ($pageCount - $linkCount) + 1;
        $endPage = $pageCount;
    }

    // Alter if the end is too close to the start of the list
    if ($endPage <= $linkCount)
    {
        $startPage = 1;
        $endPage = $linkCount < $pageCount ? $linkCount : $pageCount;
    }

    // Loop through and collect
    for ($i = $startPage; $i <= $endPage; $i++)
    {
        $disabledClass = $i == $currentPage ? 'disabled' : '';
        $paginationHtml .= '<li class="page-item '.$disabledClass.'">
                                <a class="page-link" href="'.$paginator->url($i).'">'.$i.'</a>
                            </li>';
    }

    // Next item
    $nextDisabled = $currentPage == $pageCount ? 'disabled' : '';
    $paginationHtml .= '<li class="page-item '.$nextDisabled.'">
                            <a class="page-link" href="'.$paginator->url($currentPage + 1).'" aria-label="Next">
                                <span aria-hidden="true">&raquo;</span>
                                <span class="sr-only">Next</span>
                            </a>
                        </li>';

    $paginationHtml .= '</ul>';

    echo $paginationHtml;
}
Community
  • 1
  • 1
dKen
  • 3,078
  • 1
  • 28
  • 37
1

beside the answer of @MantasD I would like to offer comprehensive customized Laravel pagination. Assuming using Laravel 5.2 and the following included view:

@include('pagination.default', ['pager' => $users])

Features

  • Showing Previous and Next buttons and disable them when not applicable
  • Showing First and Last page icon only if the Previous and Next page not doing the same
  • Generate relative links ex: (10, 100, 500 .. etc.) instead of limiting pages
  • Showing result from x to y of each page using a helper function.

default.blade.php

@if($pager->lastPage() != 1)
<ul class="pagination">

    @unless($pager->currentPage() < 3)
        <li class="paginate_button previous">
            <a href="{{ $pager->url(1) }}" title="First Page"><i class="fa fa-angle-double-left"></i></a>
        </li>
    @endunless

    <li class="paginate_button previous @unless($pager->previousPageUrl())disabled @endunless">
        <a href="{{ $pager->previousPageUrl() }}"><i class="fa fa-angle-left"></i></a>
    </li>

    @while($pager->paging++ < $pager->lastPage())
        @if (abs($pager->paging - $pager->currentPage()) >= 2)
            {{-- Generate relative links (eg. +10,etc) --}}
            @if(in_array(abs($pager->paging - $pager->currentPage()), array(10, 50, 100, 500, 1000))
            and $pager->paging != 1 and $pager->paging != $pager->lastPage())
                <li class="paginate_button @unless($pager->currentPage() != $pager->paging)active @endunless">
                    <a title="Results from {{ PaginationStartEnd($pager->paging, $pager->perPage(), $pager->total())['start'] }} to {{ PaginationStartEnd($pager->paging, $pager->perPage(), $pager->total())['end'] }} of {{ $pager->total() }}" href="{{ $pager->url($pager->paging) }}">
                        <!-- + {{ $pager->paging - $pager->currentPage() }} -->{{ $pager->paging }}
                    </a>
                </li>
            @endif
        @else
            <li class="paginate_button @unless($pager->currentPage() != $pager->paging)active @endunless">
                <a title="Results from {{ PaginationStartEnd($pager->paging, $pager->perPage(), $pager->total())['start'] }} to {{ PaginationStartEnd($pager->paging, $pager->perPage(), $pager->total())['end'] }} of {{ $pager->total() }}" href="{{ $pager->url($pager->paging) }}">
                    {{ $pager->paging }}
                </a>
            </li>
        @endif
    @endwhile

    <li class="paginate_button next @unless($pager->nextPageUrl())disabled @endunless">
        <a href="{{ $pager->nextPageUrl() }}"><i class="fa fa-angle-right"></i></a>
    </li>

    @unless($pager->lastPage() - $pager->currentPage() < 2)
        <li class="paginate_button next">
            <a href="{{ $pager->url($pager->lastPage()) }}" title="Last Page"><i class="fa fa-angle-double-right"></i></a>
        </li>
    @endunless

</ul>
@endif

PaginationStartEnd function

if (!function_exists('PaginationStartEnd')) {
function PaginationStartEnd($currentPage, $perPage, $total)
{
    $pageStart = number_format( $perPage * ($currentPage - 1));
    $pageEnd = $pageStart +  $perPage;

    if ($pageEnd > $total)
        $pageEnd = $total;

    $pageStart++;

    return array('start' => number_format($pageStart), 'end' => number_format($pageEnd));
}
}

You can use and customize this more as you wish.

Note: $pager->paging is variable set to 0 declared in the controller action

ClearBoth
  • 2,235
  • 2
  • 18
  • 24
  • where and which Controller exactly can I declare `$pager->paging` to `0`. I did not understand. I got `Undefined property: Illuminate\Pagination\LengthAwarePaginator::$paging` error after trying your code. – Ahmad Badpey Dec 28 '16 at 15:56
  • 1
    @A.B.Developer you have to add $pager->paging = 0 whenever you are calling pagination results. For instance, you are requesting some sort of profiles and wanna get the restults in paginations: $profiles = Profile::with('contract')->withTrashed()->orderBy('birthday', 'asc')->paginate(12); $profiles->paging = 0; return view('pages.profiles.list', compact('profiles')); With Laravel 5.3 you can use these customization easily by php artisan vendor:publish --tag=laravel-pagination – ClearBoth Dec 28 '16 at 20:38
  • I tried your codes but in this case I got this error again : `A non well formed numeric value encountered` at line `return array('start' => number_format($pageStart), 'end' => number_format($pageEnd));` in `PaginationStartEnd` function. – Ahmad Badpey Dec 29 '16 at 06:42
  • I finally succeed to use your approach by removing all `number_format` function calls temporary . all things worked fine but is there any way to limit links that are displayed totally? – Ahmad Badpey Dec 29 '16 at 08:20
  • 1
    @A.B.Developer not sure what you mean by limiting links but you can customized the template default.blade.php as you like. Generated relative links can be limited by changing values inside the array(10, 50, 100, 500, 1000). – ClearBoth Dec 29 '16 at 11:16
1

In Laravel 5.4

The easiest way I found, by exporting them to your resources/views/vendor directory using the vendor:publish command

php artisan vendor:publish --tag=laravel-pagination

and than go to resources\views\vendor\pagination\default.blade.php

and do your customization there.

Full documentation about this can be found here

Yousef Altaf
  • 2,631
  • 4
  • 46
  • 71
1

I use this code with k7 theme and use this code with their built in class. You can also use this code with your theme and your class as you need..

try to do this.

<section class="page-paging pt-0">
  <div class="container">
    <div class="row">
      <div class="col-12">
        <nav aria-label="Page navigation example">
          @if ($view_post->lastPage() > 1)
            <ul class="pager list-inline mb-0 text-center">
              <li class="{{ ($view_post->currentPage() == 1) ? ' disabled' : '' }}p-1 list-inline-item float-sm-left">
                <a class="active page-link brd-gray px-4 py-3 font-weight-bold" href="{{ $view_post->url(1) }}">
                  <i class="fa fa-angle-left pr-1"></i> Prev
                </a>
              </li>
              @for ($i = 1; $i <= $view_post->lastPage(); $i++)
              <li class=" p-1 list-inline-item d-none d-md-inline-block">
                <a class="{{ ($view_post->currentPage() == $i) ? ' active' : '' }} page-link brd-gray px-4 py-3 font-weight-bold" href="{{ $view_post->url($i) }}">{{ $i }}
                </a>
              </li>
              @endfor
              <li class="{{ ($view_post->currentPage() == $view_post->lastPage()) ? ' disabled' : '' }} p-1 list-inline-item float-sm-right">
                <a class="active page-link brd-gray px-4 py-3 font-weight-bold" href="{{ $view_post->url($view_post->currentPage()+1) }}"> Next 
                  <i class="fa fa-angle-right pl-1"></i>
                </a>
              </li>
            </ul>
          @endif
        </nav>
      </div>
    </div>
  </div>
</section>
ochs.tobi
  • 3,214
  • 7
  • 31
  • 52
1

Here is an easy solution of customized Laravel pagination both server and client side code is included.

Assuming using Laravel 5.2 and the following included view:

@include('pagination.default', ['pager' => $data])

Features

  • Showing Previous and Next buttons and disable them when not applicable.
  • Showing First and Last page buttons.
  • Example: ( Previous|First|...|10|11|12|13|14|15|16|17|18|...|Last|Next )

default.blade.php

@if ($paginator->last_page > 1)
<ul class="pagination pg-blue">
    <li class="page-item {{($paginator->current_page == 1)?'disabled':''}}">
        <a class="page-link" tabindex="-1" href="{{ '/locate-vendor/'}}{{ substr($paginator->prev_page_url,7) }}">
            Previous
        </a>
    </li>

    <li class="page-item {{($paginator->current_page == 1)?'disabled':''}}">
        <a class="page-link" tabindex="-1" href="{{ '/locate-vendor/1'}}">
            First
        </a>
    </li>

    @if ( $paginator->current_page > 5 )
    <li class="page-item">
        <a class="page-link" tabindex="-1">...</a>
    </li>
    @endif

    @for ($i = 1; $i <= $paginator->last_page; $i++)
        @if ( ($i > ($paginator->current_page - 5)) && ($i < ($paginator->current_page + 5)) )
        <li class="page-item {{($paginator->current_page == $i)?'active':''}}">
            <a class="page-link" href="{{'/locate-vendor/'}}{{$i}}">{{$i}}</a>
        </li>
        @endif
    @endfor

    @if ( $paginator->current_page < ($paginator->last_page - 4) )
    <li class="page-item">
        <a class="page-link" tabindex="-1">...</a>
    </li>
    @endif

    <li class="page-item {{($paginator->current_page==$paginator->last_page)?'disabled':''}}">
        <a class="page-link" href="{{'/locate-vendor/'}}{{$paginator->last_page}}">
            Last
        </a>
    </li>

    <li class="page-item {{($paginator->current_page==$paginator->last_page)?'disabled':''}}">
        <a class="page-link" href="{{'/locate-vendor/'}}{{substr($paginator->next_page_url,7)}}">
            Next
        </a>
    </li>
</ul>
@endif

Server Side Controller Function

public function getVendors (Request $request)
    {
        $inputs = $request->except('token');
        $perPage  = (isset($inputs['per_page']) && $inputs['per_page']>0)?$inputs['per_page']:$this->perPage;   
        $currentPage = (isset($inputs['page']) && $inputs['page']>0)?$inputs['page']:$this->page;   
        $slice_init = ($currentPage == 1)?0:(($currentPage*$perPage)-$perPage);

        $totalVendors = DB::table('client_broker')
                           ->whereIn('client_broker_type_id', [1, 2])
                           ->where('status_id', '1')
                           ->whereNotNull('client_broker_company_name')
                           ->whereNotNull('client_broker_email')
                           ->select('client_broker_id', 'client_broker_company_name','client_broker_email')
                           ->distinct()
                           ->count();

        $vendors = DB::table('client_broker')
                           ->whereIn('client_broker_type_id', [1, 2])
                           ->where('status_id', '1')
                           ->whereNotNull('client_broker_company_name')
                           ->whereNotNull('client_broker_email')
                           ->select('client_broker_id', 'client_broker_company_name','client_broker_email')
                           ->distinct()
                           ->skip($slice_init)
                           ->take($perPage)
                           ->get();

        $vendors = new LengthAwarePaginator($vendors, $totalVendors, $perPage, $currentPage);

        if ($totalVendors) {
            $response = ['status' => 1, 'totalVendors' => $totalVendors, 'pageLimit'=>$perPage, 'data' => $vendors,  'Message' => 'Vendors Details Found.'];
        } else {
            $response = ['status' => 0, 'totalVendors' => 0, 'data' => [], 'pageLimit'=>'',  'Message' => 'Vendors Details not Found.'];
        }
        return response()->json($response, 200);

    }

TylerH
  • 20,799
  • 66
  • 75
  • 101
1

If you want to customize your pagination link using next and prev. You can see at Paginator.php Inside it, there's some method I'm using Laravel 7

<a href="{{ $paginator->previousPageUrl() }}" < </a>
<a href="{{ $paginator->nextPageUrl() }}" > </a>

To limit items, in controller using paginate()

$paginator = Model::paginate(int);
Sfili_81
  • 2,377
  • 8
  • 27
  • 36
0

Thanks to MantisD's post, for Bootstrap 4 this worked nicely.

<?php
$link_limit = 7; // maximum number of links (a little bit inaccurate, but will be ok for now)
?>

@if ($paginator->lastPage() > 1)
    <div id="news_paginate" class="dataTables_paginate paging_simple_numbers">
        <ul class="pagination">
            <li id="news_previous" class="paginate_button page-item previous {{ ($paginator->currentPage() == 1) ? ' disabled' : '' }}">
                <a class="page-link" tabindex="0" href="{{ $paginator->url(1) }}">Previous</a>
            </li>
            @for ($i = 1; $i <= $paginator->lastPage(); $i++)
                <?php
                    $half_total_links = floor($link_limit / 2);
                    $from = $paginator->currentPage() - $half_total_links;
                    $to = $paginator->currentPage() + $half_total_links;
                    if ($paginator->currentPage() < $half_total_links) {
                        $to += $half_total_links - $paginator->currentPage();
                    }
                    if ($paginator->lastPage() - $paginator->currentPage() < $half_total_links) {
                        $from -= $half_total_links - ($paginator->lastPage() - $paginator->currentPage()) - 1;
                    }
                ?>
                @if ($from < $i && $i < $to)
                    <li class="paginate_button page-item {{ ($paginator->currentPage() == $i) ? ' active' : '' }}">
                        <a class="page-link" href="{{ $paginator->url($i) }}">{{ $i }}</a>
                    </li>
                @endif
            @endfor
            <li id="news_next" class="paginate_button page-item {{ ($paginator->currentPage() == $paginator->lastPage()) ? ' disabled' : '' }}">
                @if($paginator->currentPage() == $paginator->lastPage())
                    <a class="page-link" tabindex="0" href="{{ $paginator->url($paginator->currentPage()) }}" >End</a>
                @else
                    <a class="page-link" tabindex="0" href="{{ $paginator->url($paginator->currentPage()+1) }}" >Next</a>
                @endif
            </li>
        </ul>
    </div>
@endif
Naude
  • 1
0

If you want to change the page number in url instead of get data like /pageNo. ex: /2. you can use jquery to change url . I have some data in get method with the url.

$(function () {
  $('.pagination li a').each(function () {
    var link = $(this).attr('href');
    var pageText = $(this).text();
    var activePage = parseInt($('.pagination li.active span').text());
    if (pageText.trim() == "«") {
      pageText = activePage - 1;
    } else if (pageText.trim() == "»") {
      pageText = activePage + 1;
    }
    link = link.replace('?', '/' + pageText + '?');
    link = link.replace('&page=' + pageText, '');
    $(this).attr('href', link);
    console.log(link);
  });
})
Shams Reza
  • 1,087
  • 8
  • 10
0

Laravel custom pagination with data from other api written in Node.js

Controller

class BlogController extends Controller
{
        $perPage = 20;
        $page=1;  
        if (isset($_GET["page"]))
            $page  = $_GET["page"];

       //Third party api to get records, you can put directly your url , I made a Api class to call third party api
        $records = Api::getBlogs($page, $perPage);
        $blogs =  $records['data'];
        $totalRecords = $records['totalRecords'];

       return view('blog.all',['blogs'=>$blogs,
            'pagination' =>array('totalRecords'=>$totalRecords, 'perPage'=>$perPage)
        ]);

}

Blog view

@foreach($blogs as $blog)
  {{$blog->title}}
@endforeach

@include('pagination.pagination', ['pagination'=>$pagination])

Create a new folder inside views "pagination" and make a new file inside it "pagination.blade.php", place this content

<?php 
$page=1;  
if (isset($_GET["page"]))
    $page  = $_GET["page"];

$totalPages = ceil($pagination['totalRecords'] / $pagination['perPage']); 

$count = 3;
$startPage = max(1, $page - $count);
$endPage = min( $totalPages, $page + $count);
$prev = $page - 1;
$next = $page + 1;
?>
<nav class="posts-navigation" aria-label="posts">
    <ul class="pagination">
        <li class="<?php if($page <= 1){ echo 'disabled'; } ?>">
            <a href="<?php if($page <= 1){ echo '#'; } else { echo "?page=" . $prev; } ?>" aria-label="Previous" >
            <i class="fas fa-angle-left"></i>
            </a>
        </li>
        <?php for($i = $startPage; $i <= $endPage; $i++ ): ?>
            <li class="<?php if($page == $i) {echo 'active'; } ?>"><a href="?page=<?= $i; ?>"><?= $i; ?></a></li>
        <?php endfor; ?>
        <li class="<?php if($page >= $totalPages) { echo 'disabled'; } ?>">
            <a href="<?php if($page >= $totalPages){ echo '#'; } else {echo "?page=". $next; } ?>" aria-label="Next">
            <i class="fas fa-angle-right"></i>
            </a>
        </li>
    </ul>
</nav>
Muhammad Shahzad
  • 9,340
  • 21
  • 86
  • 130
0

Laravel 8 Custom Pagination

I am new to Laravel, besides other customize solutions I try to replicate the phpadmin style pagination with following Features

  • Showing Previous and Next buttons and disable them when not applicable.
  • Showing First and Last page buttons and disable them when not applicable.
  • Pages appears as selectable Pagination list with current selection.

Phpadmin Style Pagination

First run following command to publish Laravel Pagination

php artisan vendor:publish --tag=laravel-pagination

this will generate folder in views/vendor/pagination than

  • go to "resources\views\vendor\pagination\default.blade.php" or
  • create a new template file "mypagination-selectable.blade.php" in foler "views/vendor/pagination" and do your customization there.

just make sure you have this in your AppServiceProvider.

use Illuminate\Pagination\Paginator;
public function boot()
{
     Paginator::useBootstrap();
}

and you're good to go.

Use following code in default.blade.php or mypagination-selectable.blade.php

<ul class="pagination pagination mb-0">
    {{-- Previous Page Link --}}
    @if ($paginator->onFirstPage())
        <li class="page-item disabled" aria-disabled="true" aria-label="@lang('pagination.first')">
            <span class="page-link" aria-hidden="true">1 &laquo;</span>
        </li>
        <li class="page-item disabled" aria-disabled="true" aria-label="@lang('pagination.previous')">
            <span class="page-link" aria-hidden="true">&lsaquo;</span>
        </li>
    @else
        <li class="page-item">
            <a class="page-link" href="{{ $paginator->Url(1) }}" rel="first"
                aria-label="@lang('pagination.previous')">1 &laquo;</a>
        </li>
        <li class="page-item">
            <a class="page-link" href="{{ $paginator->previousPageUrl() }} " rel="prev"
                aria-label="@lang('pagination.previous')">&lsaquo;</a>
        </li>
    @endif

    {{-- Link of Pages with dropdown including Previous and Next --}}
    {{-- This easily fit in 3-columns --}}
    <div class="d-flex justify-content-center mx-1 " style="font-size:small;">
        <form action="#" method="get" class="d-flex input-group-sm ">
            @csrf
            <select name={{ $paginator->getPageName() }} id={{ $paginator->getPageName() }} onchange="return pagesubmit($(this).val())">
                @foreach (range(1, $paginator->lastPage()) as $i)
                <option value={{ $paginator->url($i) }}  @if($paginator->currentPage() == $i) selected @endif >{{ $i }} </option>
                @endforeach
            </select>
        </form>
    </div>
    
    {{-- Next Page Link --}}
    @if ($paginator->hasMorePages())
        <li class="page-item">
            <a class="page-link" href="{{ $paginator->nextPageUrl() }}" rel="next"
                aria-label="@lang('pagination.next')">&rsaquo;</a>
        </li>
        <li class="page-item">
            <a class="page-link" href="{{ $paginator->Url($paginator->lastPage()) }}" rel="last"
                aria-label="@lang('pagination.next')">&raquo; {{ $paginator->lastPage() }}</a>
        </li>
    @else
        <li class="page-item disabled" aria-disabled="true" aria-label="@lang('pagination.next')">
            <span class="page-link" aria-hidden="true">&rsaquo;</span>
        </li>
        <li class="page-item disabled" aria-disabled="true" aria-label="@lang('pagination.last')">
            <a class="page-link" href="{{ $paginator->Url($paginator->lastPage()) }}" rel="last"
                aria-label="@lang('pagination.next')">&raquo; {{ $paginator->lastPage() }}</a>
        </li>
    @endif
</ul>

in your controller

public function index(Request $request)
{
    $units_perpage = 10;//Per_Page setting
    $current_pageno  = request()->input('units_pageno',1);// setting Current page based on input
    $sysunits = DB::table('sys_units')
                ->orderBY('unit_title')
                ->latest()
                ->paginate($perPage = $units_perpage, $columns = ['*'], $pageName = 'units_pageno');
            }
    ...
    return view('appunits_index',compact('sysunits'))
    ->with('i',($current_pageno - 1) * $units_perpage);
}

in your blade

{{--Application Pagination --}}
<div class="col-3 d-flex justify-content-end">
    {!! $sysunits->appends(['sort' => 'unit_title'])
    ->links('pagination::mypagination-selectable') !!}
</div>

with script as

<script>
    //Called from Custom Pagination select blade 
    function pagesubmit($page_url) {
        window.location = $page_url; 
    }
</script>

Customize Selectable Pagination

0

Here is an other example

  • Contoller

    $projects = $projects->offset($page * $limit)->paginate($limit);

  • Blade file

    {{$projects->links('provider.pages.merchandising.partials.paginator')}}

  • Paginator View

      <div class="d-flex flex-wrap mr-3">
          <!-- first/previous -->
          @if($paginator->currentPage() > 1)
              <a href="{{ $paginator->url(1) }}" class="btn btn-icon btn-sm btn-light-primary mr-2 my-1">
                  <i class="ki ki-bold-double-arrow-back icon-xs"></i>
              </a>
              <a href="{{$paginator->url($paginator->currentPage() - 1)}}" class="btn btn-icon btn-sm btn-light-primary mr-2 my-1">
                  <i class="ki ki-bold-arrow-back icon-xs"></i>
              </a>
          @else
              <a href="javascript:void(0)" class="btn btn-icon btn-sm btn-light-secondary mr-2 my-1">
                  <i class="ki ki-bold-double-arrow-back icon-xs text-white"></i>
              </a>
              <a href="javascript:void(0)" class="btn btn-icon btn-sm btn-light-secondary mr-2 my-1">
                  <i class="ki ki-bold-arrow-back icon-xs text-white"></i>
              </a>
          @endif
    
          @php
              $interval = isset($interval) ? abs(intval($interval)) : 3 ;
              $from = $paginator->currentPage() - $interval;
              if($from < 1){
                  $from = 1;
              }
    
              $to = $paginator->currentPage() + $interval;
              if($to > $paginator->lastPage()){
                  $to = $paginator->lastPage();
              }
          @endphp
    
          @if($from > 1)
              <a href="{{ $paginator->url($from - 1) }}" class="btn btn-icon btn-sm border-0 btn-hover-primary mr-2 my-1">...</a>
          @endif
    
          @for($i = $from; $i <= $to; $i++)
              @php
                  $isCurrentPage = $paginator->currentPage() == $i;
              @endphp
              <a href="{{ !$isCurrentPage ? $paginator->url($i) : 'javascript:void(0)' }}"  class="{{ $isCurrentPage ? 'active' : '' }} btn btn-icon btn-sm border-0 btn-hover-primary mr-2 my-1">
                  {{ $i }}
              </a>
          @endfor
    
          @if($to < $paginator->lastPage())
              <a href="{{ $paginator->url($to + 1) }}" class="btn btn-icon btn-sm border-0 btn-hover-primary mr-2 my-1">...</a>
          @endif
    
          @if($paginator->currentPage() < $paginator->lastPage())
              <a href="{{ $paginator->url($paginator->currentPage() + 1) }}" class="btn btn-icon btn-sm btn-light-primary mr-2 my-1">
                  <i class="ki ki-bold-arrow-next icon-xs"></i>
              </a>
              <a href="{{ $paginator->url($paginator->lastpage()) }}" class="btn btn-icon btn-sm btn-light-primary mr-2 my-1">
                  <i class="ki ki-bold-double-arrow-next icon-xs"></i>
              </a>
          @else
              <a href="javascript:void(0)" class="btn btn-icon btn-sm btn-light-primary mr-2 my-1">
                  <i class="ki ki-bold-arrow-next icon-xs"></i>
              </a>
              <a href="javascript:void(0)" class="btn btn-icon btn-sm btn-light-primary mr-2 my-1">
                  <i class="ki ki-bold-double-arrow-next icon-xs"></i>
              </a>
          @endif
      </div>
    
  • It should looks like this.

enter image description here

F.E
  • 688
  • 6
  • 10
-3
  1. Create a function in your controller:

public function paginate($items, $perPage, $page = null){ $page = $page ?: (Paginator::resolveCurrentPage() ?: 1); $total = count($items); $currentpage = $page; $offset = ($currentpage * $perPage) - $perPage ; $itemstoshow = array_slice($items , $offset , $perPage); return new LengthAwarePaginator($itemstoshow ,$total ,$perPage); }

2.use before class controller perameter :

use Illuminate\Pagination\Paginator; use Illuminate\Pagination\LengthAwarePaginator;

  1. call your recently created function:

$variable = $this->paginate( your_array_data() , Per_page_data_show _amount( like 30)); $variable >withPath('');

  1. Create a link your frontend code:

{{ $helloZai_bank_withdraw->links() }}

5.Use Boot method for pagination design app/Providers/AppServiceProvider.php file

use Illuminate\Pagination\Paginator;

6.paste code in boot function app/Providers/AppServiceProvider.php file:

Paginator::useBootstrap();