Système de pagination pour son framework css sous Laravel

Sous Laravel 4, il existe un système de pagination intégré pour afficher une liste résultante d’une requête dans les bases de données.

Pagination automatique sous laravel

Ce qui s’écrit très simplement (qui a dit Laravel c’est cool?) :

//dans le controleur :
$items = DB::table('items')->select('titre')->paginate(5);
// dans la vue
@foreach($items as $item)
  <p>{{  $item->titre  }}</p>
@endforeach
<?php echo $items->links(); ?>

Paginator->links() nous affiche la pagination automatiquement, c’est très rapide et très très simple. Mais, Laravel ne fournit qu’un seul système de pagination écrit pour Bootstrap et qui n’est pas vraiment configurable.

En fait, le seul problème  c’est les classes sur les li : (valide-invalide) puisque normalement tous les framework utilisent ul-li.

Avec Foundation 4,  j’ai de la chance :)  li.class= »current » et li.class= »unavailable », le travail ne va pas être compliqué:

Vue Pagination

Dans le fichier app:config/view.php
changer pagination’ => ‘pagination::slider’, par votre vue personnelle : ‘pagination’ => ‘paginationfoundation’.

Créer une vue app/views/paginationfoundation.php

<?php
    $presenter = new App\Services\FoundationPresenter($paginator);
?>
<?php if ($paginator->getLastPage() > 1): ?>
    <ul class="pagination">
        <?php echo $presenter->render(); ?>
    </ul>
<?php endif; ?>

Class FoundationPresenter

Voici le gros morceau :)

Vous recopiez le fichier /vendor/laravel/framework/src/Illuminate/Pagination/BootstrapPresenter.php (il porte bien son nom!) dans un dossier personnel : /app/services/FoundationPresenter.php.
Il ne nous reste plus qu’a modifier les quelques nom de classes html que l’on y trouve, le namespace et le nom de la Classe.

<?php namespace App\Services;

class FoundationPresenter {
...
   public function __construct(/*Paginator*/ $paginator)
	{
		$this->paginator = $paginator;
		$this->lastPage = $this->paginator->getLastPage();
		$this->currentPage = $this->paginator->getCurrentPage();
	}
...
  public function getDots()
	{
		return '<li class="unavailable"><span>...</span></li>';
	}
...
}

Je retrouve le code html a modifier dans 4 méthodes; ici, j’ai juste mis : class= »unavailable ». Il faut juste indiquer 3 états : actif(normal),inactif(grisé),courant(gras?)

Voila, j’ai un Framework Laravel ready pour Foundation 4 :) mais il est aussi simple de le faire pour Gumby ou autres. Pure css ce serait : pure-button-disabled, pour le votre : class=inactif ?

Bonne customisation.

Share Button

Vous devriez aimer...