Laravel Custom Pagination View Example

laravel default also provide pagination view using bootstrap design like next and previous button and number page with link. but it is a very comman and generally used by most of developer. If you want to change it using Presenter class of laravel. you can set your own custom view for your pagination layout.

In bellow i give you the example of i added first, last, next and previous button and main banifit is that you can easily modify that view and link. so let's see the preview of image layout of pagination.

Preview:

So, first create new folder "Pagination"app/Pagination and inside this folder create one file "HDPresenter.php"app/Pagination/HDPresenter.php. this class file will generate custom layout for pagination. in this class file you can add your own class, div, id etc. it is very easy to understand how it works. so put bellow code in that file.

app/Pagination/HDPresenter.php

namespace App\Pagination;
use Illuminate\Pagination\BootstrapThreePresenter;

class HDPresenter extends BootstrapThreePresenter {

    public function render()
    {
        if ($this->hasPages()) {
            return sprintf(
                '<div class="pagi-custom"><div class="pull-left">%s %s</div> <div class="pull-right">%s %s</div></div>',
                $this->getFirst(),
                $this->getButtonPre(),
                $this->getButtonNext(),
                $this->getLast()
            );
        }
        return "";
    }

    public function getLast()
    {
        $url = $this->paginator->url($this->paginator->lastPage());
        $btnStatus = '';

        if($this->paginator->lastPage() == $this->paginator->currentPage()){
            $btnStatus = 'disabled';
        }
        return $btn = "<a href='".$url."'><button class='btn btn-success ".$btnStatus."'>Last <i class='glyphicon glyphicon-chevron-right'></i></button></a>";
    }

    public function getFirst()
    {
        $url = $this->paginator->url(1);
        $btnStatus = '';

        if(1 == $this->paginator->currentPage()){
            $btnStatus = 'disabled';
        }
        return $btn = "<a href='".$url."'><button class='btn btn-success ".$btnStatus."'><i class='glyphicon glyphicon-chevron-left'></i> First</button></a>";
    }

    public function getButtonPre()
    {
        $url = $this->paginator->previousPageUrl();
        $btnStatus = '';

        if(empty($url)){
            $btnStatus = 'disabled';
        }
        return $btn = "<a href='".$url."'><button class='btn btn-success ".$btnStatus."'><i class='glyphicon glyphicon-chevron-left pagi-margin'></i><i class='glyphicon glyphicon-chevron-left'></i> Previous </button></a>";
    }

    public function getButtonNext()
    {
        $url = $this->paginator->nextPageUrl();
        $btnStatus = '';

        if(empty($url)){
            $btnStatus = 'disabled';
        }
        return $btn = "<a href='".$url."'><button class='btn btn-success ".$btnStatus."'>Next <i class='glyphicon glyphicon-chevron-right pagi-margin'></i><i class='glyphicon glyphicon-chevron-right'></i></button></a>";
    }

}

Now, how to use this class in laravel blade file, so see following file how to extend this class on pagination class function.

In Blade file

@extends('layouts.app')
 
@section('content')
<div class="container">
	<table class="table table-bordered">
		<tr>
			<th>Title</th>
			<th>Description</th>
		</tr>
	@foreach ($posts as $post)
	<tr>
		<td>{{ $post->title }}</td>
		<td>{{ $post->description }}</td>
	</tr>
	@endforeach
	</table>
	{!! with(new App\Pagination\HDPresenter($posts))->render(); !!}
</div>
@endsection