Kategorien
Development

Laravel 4: Pagination mit Bootstrap 3

Bei einem meiner aktuellen Projekte muss ich sehr viele Daten auflisten. Für die Übersichtlichkeit und vor allem Ladezeit von Seiten empfiehlt es sich derart große Tabellen auf verschiedene Seiten zu verteilen: Pagination.

Über das PHP-Framework Laravel habe ich schon früher auf diesem Blog berichtet. Das Framework bietet auch zum Thema Pagination einige interessante Funktionen die ich hier kurz erklären will. Außerdem zeigt der Artikel, wie man die Pagination-Links für Bootstrap3 konform ausgeben kann.

Umsetzung im Model/Controller und Datenbankabfragen

Laravel 4 bietet dafür von Haus einige gute Methoden an:

Die Funktion paginate(int $anzahl) nimmt als Parameter die Anzahl Einträge pro Seite entgehen.

// Pagination bei einem Query-Result
$users = DB::table('users')->paginate(15);

// Pagination mit einem Eloquent-Objekt/Model
$allUsers = User::paginate(15);
$someUsers = User::where('votes', '>', 100)->paginate(15);

Natürlich könnte man diese Funktion auch selber umsetzen. Aber wieso das Rad neu erfinden?

 

Umsetzung im View/Template

Nachdem wir so nun im Controller die Funktion implementiert haben müssen natürlich an das Ende der Seite entsprechende Links. Dazu bedient man sich einfach der $model->links()-Methode.

// Auflistung der Datensätze usw...
<ul>
@foreach ($ergebnis as $zeile)
    <li>{{$zeile}}</li>
@endforeach
</ul>

// Links:
$ergebnis->links();

Schon erhalten wir eine <ul>-Liste in einem div-Container die wir nun mittels CSS formatieren können.

Bootstrap3-konforme Aufgabe

Viele werden wie ich zum Teil auch Bootstrap nutzen. Leider ist die Ausgabe von Laravel-4 standardmäßig nicht mit dem neuen Bootstrap 3 konform.

So benötigt Bootstrap 3 eine ul-Liste mit der Klasse „.pagination“ – Bootstrap2 arbeitet hier noch mit einer ul-Liste in einem div-Container mit der selben Klasse.

Mit einem kleinen Trick kann man Laravel anweisen an anderes Template für seine Links zu benutzen und somit die Ausgabe Bootstrap3-konform zu gestalten. Hierzu muss man nur eine Zeile in app/config/view.php ändern:

	/*
	|--------------------------------------------------------------------------
	| 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-3',

);

Ändert man nun das Template von „pagination::slider“ zu „pagination::slider-3“ (bootstrap-3-konform) übernimmt Bootstrap sofort die Formatierung:

Bootstrap 3: Pagination

Von Luke

Blogautor, Webdesigner, Programmierer, Tontechniker, Kameramann, Musiker, Christ, und vieles mehr

2 Antworten auf „Laravel 4: Pagination mit Bootstrap 3“

Schreibe einen Kommentar

Deine E-Mail-Adresse wird nicht veröffentlicht.